/* gdd-modular.css - 7.156.017 - 2018/09/12 10:07 */
a img { border: 0 }
h1#gdhead {
    padding-left: 40px;
    padding-top: 20px;
}
ul#gdd { padding: 20px }
ul#gdd li {
    display: block;
    margin: 10px 0 10px 20px;
}
.clearfix:before,
.clearfix:after,
.feature:before,
.feature:after {
    content: "";
    display: table;
}
.clearfix:after,
.feature:after { clear: both }
.clearfix,
.feature { zoom: 1 }
#modular-container {
    display: block;
    margin: 0 5px 0 20px;
    width: 950px;
}
#modular-container .left {
    clear: left;
    margin: 0 5px 0 25px;
}
#modular-container .right { margin: 0 25px 0 5px }
#modular-container .single { width: 280px }
#modular-container .double { width: 590px }
#modular-container .full-width { width: 950px }
#modular-container .row { padding: 20px 0 }
#modular-container h1 {
    color: #336699;
    font-size: 24px;
    margin: 20px 0;
}
#modular-container h3 {
    color: black;
    font-size: 22px;
    line-height: 26px;
    margin: 0 0 5px;
}
#modular-container p {
    color: #272727;
    font-size: 14px;
    line-height: 18px;
    margin: 0 20px 14px 0;
}
#modular-container a {
    font-size: 14px;
    line-height: 18px;
}
#modular-container a.button {
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: 41px;
    line-height: 41px;
    margin-top: 5px;
    text-align: center;
    width: 122px;
}
#modular-container a.button.wide {
    height: 45px;
    line-height: 45px;
    padding-right: 20px;
    width: 176px;
}
#modular-container a.button:active {
    left: 2px;
    position: relative;
    top: 2px;
}
#modular-container a.button.red {
    background: transparent url(/images/modular/bg-button-red.png) 0 0 no-repeat;
    color: white;
}
#modular-container a.button.red.wide { background: transparent url(/images/modular/bg-button-red-wide.png) 0 0 no-repeat }
#modular-container a.button.blue {
    background: transparent url(/images/modular/bg-button-blue.png) 0 0 no-repeat;
    color: white;
}
#modular-container a.button.blue.wide { background: transparent url(/images/modular/bg-button-blue-wide.png) 0 0 no-repeat }
#modular-container a.button.yellow {
    background: transparent url(/images/modular/bg-button-yellow.png) 0 0 no-repeat;
    color: #4a3501;
    text-shadow: #eeeeee 0px 1px 0px;
}
#modular-container a.button.yellow.wide { background: transparent url(/images/modular/bg-button-yellow-wide.png) 0 0 no-repeat }
#modular-container a.button.purple {
    background: transparent url(/images/modular/bg-button-purple.png) 0 0 no-repeat;
    color: white;
}
#modular-container a.button.purple.wide { background: transparent url(/images/modular/bg-button-purple-wide.png) 0 0 no-repeat }
#modular-container hr {
    border: 1px solid #e5e5e5;
    height: 0;
    margin: 20px 25px;
    width: 900px;
}
#modular-container .title2 {
    padding-left: 25px;
    width: 600px;
}
#modular-container .title3 {
    padding: 0 25px;
    width: 900px;
}
#modular-container .subhead {
    display: inline;
    float: left;
    width: 300px;
}
#modular-container .subhead {
    border: 3px solid #f0f0f0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin: 20px 0 10px;
    padding: 5px 7px;
    width: 280px;
}
#modular-container .subhead strong {
    color: #336699;
    font-size: 16px;
    line-height: 20px;
}
#modular-container .subhead p { margin: 0 }
#modular-container .text,
#modular-container .box,
#modular-container .list {
    display: inline;
    float: left;
}
#modular-container .text h1 { padding-left: 0 }
#modular-container .text.full-width h1 { padding-left: 25px }
#modular-container .box { width: 280px }
#modular-container .box.single.left { width: 300px }
#modular-container .box.single.right { width: 300px }
#modular-container .box.double.left { width: 590px }
#modular-container .box.double.right { width: 590px }
#modular-container .box.full-width {
    margin: 0 25px;
    width: 900px;
}
#modular-container .list {
    background: #eaeaeb url(/images/modular/bg-list.jpg) 0 0 repeat-x;
    margin-bottom: 20px;
    padding: 0 25px;
    width: 900px;
}
#modular-container .list ul {
    *list-style-position: inside;
    *margin: 0;
}
#modular-container .list ul li { position: relative }
#modular-container .list ul li a { *margin-left: 5px }
#modular-container .list ul li .item-number {
    background: transparent url(/images/modular/bg-item-number.png) 0 0 no-repeat;
    color: white;
    display: block;
    font-size: 11px;
    height: 16px;
    line-height: 16px;
    margin-top: 5px;
    left: 88px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 16px;
}
#modular-container .list.single {
    background: 0;
    border: 3px solid #f0f0f0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin: 0 5px;
    padding: 10px 12px 0;
    width: 250px;
}
#modular-container .list.single h3 {
    color: #336699;
    font-size: 18px;
}
#modular-container .list.single ol {
    color: #336699;
    float: left;
    font-size: 12px;
    *list-style-position: inside;
    margin: 0 0 0 20px;
    *margin: 0;
    *text-indent: -20px;
    width: 115px;
    *width: 135px;
}
#modular-container .list.single ol li {
    display: list-item;
    *margin: 0 0 0 20px;
    padding-right: 10px;
}
#modular-container .list.single ol li a {
    font-size: 12px;
    *margin-left: 5px;
}
#modular-container .list.single .image-wrap {
    display: inline;
    float: left;
    margin-top: 5px;
    width: 110px;
}
#modular-container .list.single .item-info {
    display: inline;
    float: left;
    width: 160px;
}
#modular-container .list.single .item-info strong {
    display: block;
    font-size: 16px;
    margin-bottom: 10px;
}
#modular-container .list.single.left {
    margin: 0 5px 0px 25px;
    width: 270px;
}
#modular-container .list.single.right {
    margin: 0 25px 0px 5px;
    width: 270px;
}
#modular-container .list.double {
    background: 0;
    border: 3px solid #f0f0f0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding: 10px 12px 0;
    width: 560px;
}
#modular-container .list.double.left ul li .item-info,
#modular-container .list.double.right ul li .item-info { width: 430px }
#modular-container .list.double h3 {
    color: #336699;
    font-size: 18px;
}
#modular-container .list.double ol {
    color: #336699;
    *list-style-position: inside;
    float: left;
    font-size: 14px;
    margin: 0 0 0 20px;
    *margin: 0;
    width: 165px;
}
#modular-container .list.double ol li {
    *display: list-item;
    padding-right: 10px;
}
#modular-container .list.double ol li a {
    font-size: 14px;
    *margin-left: 5px;
}
#modular-container .list.double ul {
    *list-style-position: inside;
    *margin: 0;
}
#modular-container .list.double ul li { *display: list-item }
#modular-container .list.double ul li a { margin-left: 5px }
#modular-container .list.double ul li .image-wrap { width: 110px }
#modular-container .list.double ul li .item-info { width: 450px }
#modular-container .list.full-width { padding-bottom: 25px }
#modular-container .list h3 {
    color: #242424;
    margin-bottom: 10px;
}
#modular-container .list h5 {
    clear: left;
    color: #242424;
    display: block;
    font-size: 13px;
    margin-bottom: 15px;
}
#modular-container .list p { margin-bottom: 15px }
#modular-container .list .list-column {
    display: block;
    float: left;
    margin-right: 20px;
    width: 280px;
}
#modular-container .list ol {
    color: #336699;
    margin: 0 0 0 20px;
}
#modular-container .list ul {
    margin: 0 0 20px;
    padding: 0;
}
#modular-container .list ul li {
    display: block;
    clear: left;
    margin: 0 0 10px;
    padding: 0;
}
#modular-container .list ul li .image-wrap {
    clear: left;
    display: block;
    float: left;
    margin-top: 5px;
    margin-bottom: 20px;
    width: 100px;
}
#modular-container .list ul li .item-info {
    display: block;
    float: left;
    margin: 5px 0 0;
    width: 180px;
}
#modular-container .list ul li .item-info a { display: block }
#modular-container .list ul li .item-info a.title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 5px;
}
#modular-container .list ul li .item-info a.more { font-size: 13px }
#modular-container .list ul li .item-info strong { font-weight: bold }
#modular-container .list ul li .item-info p {
    display: block;
    font-size: 13px;
    margin: 5px 0 15px;
}
#modular-container .list ul li .item-info p a {
    display: inline;
    font-size: 13px;
}
#modular-container .list ul.bulleted {
    color: #336699;
    margin: 0 0 0 20px;
    *margin: 0;
    list-style-type: disc;
}
#modular-container .list ul.bulleted li {
    display: list-item;
    margin: 0;
}
#modular-container .list ul.browse li { margin: 0 }
#modular-container .feature {
    display: inline;
    float: left;
}
#modular-container .feature.double { width: 590px }
#modular-container .feature.double.left { margin-right: 5px }
#modular-container .feature.double.right { margin-left: 5px }
#modular-container .feature.double .image-container {
    display: inline;
    float: left;
    width: 190px;
}
#modular-container .feature.double .details {
    display: inline;
    float: left;
    width: 400px;
}
#modular-container .feature.double .details h3 {
    color: #336699;
    margin-bottom: 5px;
}
#modular-container .feature.double .details h5 {
    color: #336699;
    font-size: 15px;
    font-weight: bold;
}
#modular-container .feature.double .details h6 {
    color: #336699;
    font-size: 15px;
    font-weight: normal;
}
#modular-container .feature.double .details p { margin: 10px 0 }
#modular-container .feature.double .details p .red-button { margin-top: 10px }
#modular-container .feature.full-width {
    margin-bottom: 20px;
    width: 950px;
}
#modular-container .feature.full-width #tout {
    float: left;
    margin: 15px 0;
    padding-left: 25px;
    width: 600px;
}
#modular-container .feature.full-width #promo {
    background: white;
    border: 1px solid #336699;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    float: left;
    margin: 15px 0;
    padding: 15px 14px;
    width: 270px;
}
#modular-container .feature.full-width #promo strong {
    color: #336699;
    display: block;
    font-size: 18px;
}
#modular-container .feature.full-width #promo ul { margin: 10px 0 }
#modular-container .feature.full-width #promo ul.bulleted { list-style: disc }
#modular-container .feature.full-width #promo ol {
    color: #336699;
    margin: 10px 0 10px 20px;
}
#modular-container .feature.full-width #promo p {
    clear: left;
    float: left;
    padding: 0;
    margin: 10px 0 0;
    width: 170px;
}
#modular-container .feature.full-width #promo a.yellow-button { margin-top: 10px }
#modular-container .feature.full-width #promo .image-container {
    float: left;
    text-align: right;
    width: 100px;
}
#modular-container .feature.full-width #promo .image-container img { text-align: right }
#modular-container .feature h3 {
    color: #336699;
    display: block;
    font-size: 24px;
    width: 600px;
}
#modular-container .gallery {
    display: block;
    float: left;
}
#modular-container .gallery .gallery-container { height: 160px }
#modular-container .gallery .next,
#modular-container .gallery .previous {
    display: block;
    height: 19px;
    position: absolute;
    top: 50%;
    width: 17px;
    z-index: 10;
}
#modular-container .gallery .previous {
    background: transparent url(/images/modular/arrow-left.png) 0 0 no-repeat;
    left: 0;
}
#modular-container .gallery .next {
    background: transparent url(/images/modular/arrow-right.png) 0 0 no-repeat;
    right: 0;
}
#modular-container .gallery h3 {
    color: #242424;
    font-size: 18px;
    margin: 5px 0 15px;
}
#modular-container .gallery ul {
    margin: 0 0 10px;
    padding: 0;
}
#modular-container .gallery ul li {
    display: block;
    float: left;
    padding: 0 5px;
    text-align: center;
    width: 170px;
}
#modular-container .gallery ul li .image-container {
    display: block;
    height: 120px;
    line-height: 120px;
    text-align: center;
}
#modular-container .gallery ul li .image-container img {
    display: inline;
    margin: 0 auto 5px;
    text-align: center;
    vertical-align: bottom;
}
#modular-container .gallery ul li a {
    display: block;
    margin-bottom: 5px;
}
#modular-container .gallery ul li span.meta { display: block }
#modular-container .gallery.double {
    position: relative;
    overflow: hidden;
    width: 590px;
}
#modular-container .gallery.double.left { margin-right: 5px }
#modular-container .gallery.double.left ul { *margin-left: 25px }
#modular-container .gallery.double.left .next { right: 25px }
#modular-container .gallery.double.right { margin-left: 5px }
#modular-container .gallery.double.right .previous { left: 25px }
#modular-container .gallery.full-width {
    margin: 0 25px;
    position: relative;
    overflow: hidden;
    width: 900px;
}
#fathers .feature.full-width {
    background: url("/images/modular/fathers-day-hero.png") no-repeat scroll 0 0 transparent;
    height: 225px;
}
#fathers .feature.full-width #tout h3 {
    color: #2D7732;
    font-size: 27px;
}
#fathers  .feature.full-width #tout p {
    color: #2D7731;
    font-size: 22px;
    line-height: 24px;
    margin: 20px 200px 0 0;
}
#fathers  h1 { margin-left: 30px }
#modular-container .gallery ul li .image-container { margin-bottom: 8px }
#modular-container .gallery .gallery-container { height: 170px }
#modular-container ul.small {
    color: #336699;
    float: left;
    margin: 0 0 0 0px;
    width: 115px;
}
#modular-container ul.small.two { margin: 0 0 0 15px }
#modular-container ul.small a { font-size: 12px }
#modular-container .list.single ol.wide {
    width: 220px;
    line-height: 25px;
}


#summer-reads .feature.full-width {
    background: url("/images/promos/summer-reads-hero-exp.png") no-repeat scroll 0 0 transparent;
    height: 225px;
}
ul#thumbnails li,
ul#thumbnails li a,
ul#thumbnails li .item-info,
#modular-container .list.single .item-info strong { font-size: 13px !important }
ul#thumbnails .image-wrap {
    width: 68px !important;
    margin-bottom: 0px !important;
}
ul#thumbnails strong { margin-bottom: 0px !important }
ul#thumbnails img { border: 1px solid #ccc }
#summer-reads h3.dotted {
    border-top: 1px dotted #ccc;
    display: block;
    padding-top: 5px;
    margin-top: 5px;
}
ul#thumbnails li .image-wrap img {
    float: left;
    margin-right: 6px;
    width: 45px;
}
ul#thumbnails li .image-wrap .number {
    padding: 1px 2px 0 0;
    font-size: 13px;
    font-weight: bold;
}
#summer-reads .row { padding: 4px 0 !important }


#modular-container.staff-picks { margin: 0px 0 0 -10px }
#modular-container.staff-picks .feature.full-width  {
    background: #99CCFF;
    height: auto;
    margin-top: -15px;
    padding-top: 10px;
    
    background-image: -ms-linear-gradient(top left, #FFFFFF 0%, #99CCFF 100%);
    
    background-image: -moz-linear-gradient(top left, #FFFFFF 0%, #99CCFF 100%);
    
    background-image: -o-linear-gradient(top left, #FFFFFF 0%, #99CCFF 100%);
    
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #FFFFFF), color-stop(1, #99CCFF));
    
    background-image: -webkit-linear-gradient(top left, #FFFFFF 0%, #99CCFF 100%);
    
    background-image: linear-gradient(to bottom right, #FFFFFF 0%, #99CCFF 100%);
}
#modular-container.staff-picks .text.full-width h1 {
    margin: 10px 0 15px 0;
    font-size: 28px;
}
#modular-container.staff-picks .feature.full-width #tout {
    float: left;
    margin: 15px 0;
    padding-left: 25px;
    width: 600px;
}
#modular-container.staff-picks .feature.full-width #tout h1 {
    color: #369;
    display: block;
    font-size: 34px;
    width: auto;
    margin: 0px 0px 15px 0px;
    -moz-text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
    -webkit-text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
}
#modular-container.staff-picks .feature.full-width #tout h2 {
    color: #666;
    display: block;
    font-size: 20px;
    width: auto;
    margin-bottom: 8px;
}
#modular-container.staff-picks .feature.full-width #promo { margin-top: 112px }
#modular-container.staff-picks .feature.full-width #promo .image-container.headshot {
    width: 100;
    text-align: center;
    margin-top: 10px;
}
#modular-container.staff-picks .feature.full-width #promo h3 {
    margin: 0;
    padding: 0;
    font-size: 16px;
}
#modular-container.staff-picks a { cursor: pointer }
#modular-container.staff-picks .featured-item {
    float: left;
    padding: 0 15px 10px 0px;
    text-align: left;
}
#modular-container.staff-picks .featured-item img { border: 1px solid #000 }
#modular-container.staff-picks .featured-item a { font-size: 12px }
#modular-container.staff-picks .featured-item h3 {
    line-height: 18px;
    margin: 0px 0px;
    width: 100px;
}
#modular-container.staff-picks .featured-item h3 a { font-size: 16px }
#modular-container.staff-picks .featured-item p { margin-bottom: 5px }
#modular-container.staff-picks .featured-info {
    float: left;
    width: 400px;
}
#modular-container.staff-picks .featured-info p {
    line-height: 18px;
    margin: 0px 0px;
    color: #272727;
}
#modular-container.staff-picks .featured-info ul {
    margin: 5px 0px 0px 0px;
    padding: 0 0px;
    font-size: 14px;
}
#modular-container.staff-picks .featured-info ul li { padding-bottom: 5px }
#modular-container.staff-picks .list.double {
    background: url("/images/modular/bg-list.jpg") repeat-x scroll 0 0 #EAEAEB;
    border: 3px solid #DDDDDD;
    width: 515px;
}
#modular-container.staff-picks .list.double.left ul li .item-info,
#modular-container .list.double.right ul li .item-info { width: 370px }
#modular-container.staff-picks .list.double ul li .image-wrap img {
    width: 90px;
    border: 1px solid #000;
}
#modular-container.staff-picks .list.double ul li a { margin-left: 0px }
#modular-container.staff-picks .list.single .image-wrap img {
    width: 90px;
    border: 1px solid #000;
}
#modular-container.staff-picks .list.single.right {
    background: url("/images/modular/bg-list.jpg") repeat-x scroll 0 0 #EAEAEB;
    border: 3px solid #DDDDDD;
    width: 315px;
}
#modular-container.staff-picks .list.single.right ul li { margin-bottom: 20px }
#modular-container.staff-picks .list.single .item-info { width: 185px }
#modular-container.staff-picks .list ul li .item-info p { margin-bottom: 5px }
#modular-container.staff-picks .list p.title {
    font-size: 16px;
    font-weight: bold;
    color: #272727;
}
#modular-container.staff-picks .list p.tag {
    color: #272727;
    font-style: italic;
}
#modular-container.staff-picks hr.divide {
    width: 450px;
    text-align: center;
    margin: 10px auto 20px;
    border: 1px solid #ddd;
}
#modular-container.staff-picks .list ul li .item-info p.selection { margin-top: 10px }