/* Brochure Page Styles */
/***********************************/


/* Be aware cascade applies to properties within a css rule. Below the background color is overridden by the background url when it comes first. However it works fine when the background color comes after the background url. */

    .content {
        min-width: 710px;
    }


    .content p {
        text-align: center;
    }

   /* .content p {
        margin: 0 auto;
        background: #33EED1;
    }*/



    #content {
        background: #FFF;
        margin: 0 auto;
        width:82%;
        }

    #content img {  
    border: solid black 1px;
    }	

    .photo-left {
        background:#FFF;
        padding: 8px 0;
        width: 280px;
        float: left;
        }

    .photo-right {
        background: #FFF;
        padding: 8px 0;
        width: 280px;
        float: right;
        }

    .photo-center {
        background: #FFF;
        width: 280px;
        padding: 8px 0;
        margin: 0 auto;
        clear: right;
        }

    .floating-box {
        display: inline-block;
        background-color: none;
        /*width: 75px;
        height: 75px;*/
        margin: auto;
    }


    .floating-box > p {
        font-family: Arial, Helvetica, San-serif;
    }


    .portrait {
        margin: 25px 10px 5px 14px;
        /*margin-top: 5px;*/
        width: 88px;
        height: 128px;
    }

    .landscape {
        margin: 12px 4px 5px 4px;
        width: 128px;
        height: 88px;
    }

    .xtra-bottom {

        padding-bottom: 20px;
    }
    /*This style is used with a spacer image to make images move to the right the width of a portrait image*/    
    .spacer-right {
        margin: 25px 0 5px 0;
        /*margin-top: 5px;*/
        width: 88px;
        height: 128px;
    }

    .spacer-landscape-right {
        margin: 25px 0 5px 0;
        /*margin-top: 5px;*/
        width: 118px;
        height: 64px;
    }

 /*This style is used with a spacer image to make images move to the right a half width of a portrait image*/    
    .spacer-half-right {
        margin: 12px 0 5px 0;
        /*margin-top: 5px;*/
        width: 64px;
        height: 64px;
    }


    .spacer-quarter-right {
        margin: 12px 0 5px 0;
        /*margin-top: 5px;*/
        width: 56px;
        height: 64px;
    }

    .floating-box p {
        margin: 0 auto;
        text-align: center;
        /*float: right;
        clear: left;*/
        color: #000;
    }

    .floating-row {
        margin: 0 auto;
        text-align: center;
    }

    .prev-next {
/*        margin-left: 34%;*/
        padding-top: 24px;
        margin: 0 auto;
        width: 70%;
        font-size: 1.4em;
        color: #1a00b1;
    }


/*
    .after-box {
        margin-left: 40%;
        width: 70%;
        font-size: 1.2em;
        color: #1a00b1;
    }
*/

    footer {
		padding: 10px 0px;
        background-color: #FFF;
        height: 50px;

    }

	footer p {
		text-align: center;
	}