@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,100);

body {width:100%; height:100%; text-align:center;font-family: 'Roboto Condensed', sans-serif;
       background-position:left top; background-repeat:repeat-y; padding:0px; margin:0px;
}
#slideShow {
    width: 935px; height:350px; margin:0 auto; border:none; overflow:hidden; overflow-y:hidden;
}
#background {
    width: 100%; 
    height: 100%; 
    position: fixed; 
    left: 0px; 
    top: 0px; 
    z-index: -100; /* Ensure div tag stays behind content; -999 might work, too. */
}

.stretch {
    width:100%;
    height:100%;
}

/* web display layup - container (outer shadows / inner white) */
#layout-outer {
    width: 1073px;    
    background-image: url(../graphics/shadowback.png);
    background-position: center top;
    margin: 0 auto;
    background-repeat: no-repeat;
    height:auto;
}
#layout-inner {width:980px; background-color:#fff; margin:0 auto; height:auto; padding:10px; display:block; overflow:auto;
               text-align:left;min-height:600px;
}

/* ----------------------------------------------------------------------------------------------------
    review order
------------------------------------------------------------------------------------------------------ */

.reviewOrder {
    font-family: 'Roboto Condensed', sans-serif; border-collapse:collapse;
    width:100%;
}

    .reviewOrder th {
        background-color: #a99b7e; color:#0e0101;
        padding:3px; text-align:left;
    }
    .reviewOrder td {
        padding:3px; text-align:left;
    }
    .reviewOrder tr:nth-child(odd)		{ background-color:#eee; }
    .reviewOrder tr:nth-child(even)		{ background-color:#fff; }
    .reviewOrder tr:hover {
        background-color:#ebe3cd;
    }
.bin-remove-product {
    cursor: pointer;
}

.reviewproduct-wrap {
        width:35px;        
        overflow:hidden;        
    }

.reviewproduct-wrap img {
    width:100%; height:auto; border:none;
}


#preview{
	position:absolute;
	border:1px solid #ccc;
	background:#333;
	padding:2px;
	display:none;
	color:#fff;    
    
	}
    #preview img {
        max-height: 200px;
    }

.review-table {
    height: 415px;
    overflow-y: auto;
    width:730px;
    background-color:#fff;
}

#txEmailAddress {
    border:none;
    padding:3px;
    font-size:.9em;
    background-color:#a9bb5a;
    color:#fff;font-family: 'Roboto Condensed', sans-serif;width:250px; float:right;

}

/* ----------------------------------------------------------------------------------------------------
    menu navigator 
------------------------------------------------------------------------------------------------------ */
#navigator {
    
    list-style: none;
    height:50px;
    background-color:#fff;
    padding:0px; margin:0px;
    margin-bottom:30px;    
    padding-top:5px; padding-bottom:5px;
    display:block;
}

    #navigator li {
        display: inline;
        list-style: none; 
    }

    #navigator a {
        
        height:50px;
        line-height:50px;
        width:100px;
        display: inline-block;                
        background-color:#0e0101;
        color:#ece7db;
        text-align:center;
        text-decoration:none;
        font-family: 'Roboto Condensed', sans-serif;
        font-size:1em;
        font-weight:300;
    }

        #navigator a:hover {
            cursor: pointer;
            background-color: #a99b7e;
        }

/* ----------------------------------------------------------------------------------------------------
    search text box
------------------------------------------------------------------------------------------------------ */
.header-buttons {float:right;margin-top:-72px;background-color: #a9bb5a;
        border:none; color:#fff;
        height:25px;
        cursor:pointer;
        margin-right:10px;        
}
.header-buttons:hover { background-color:#88993d;}
#login-credentials {float:right; position:absolute; text-align:right; width:1000px; margin-top:-58px;
}

#txLoginAddress {
    border: 1px solid #e8e8e8;
    height: 22px;
    width: 200px;
    font-family: 'Roboto Condensed' , sans-serif;
    font-style: italic;
    color:#a99b7e;
}
    #txLoginAddress:focus {
        font-style: normal;
        color: #333;
    }
#searchbox {
    
    display: inline-block;
    width: 360px;
    height: 32px;
    background-image: url(../graphics/search-left.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding-left:10px;    
    vertical-align:top;
    margin-top:4px;    
    margin-top:-75px;
    margin-left:450px;
    
}
    #searchbox input {
        display:inline-block;
        border: none;
        width: 320px;
        background-color:transparent;
        color:#b4b1b1;
        vertical-align:middle;
        margin-bottom:10px;
        height:32px; font-family: 'Roboto Condensed', sans-serif;

        
    }

/* home page product */
.homepage-slide {
    cursor: pointer;
}
.homepage-product {
    margin-top:10px; margin-bottom:10px;
    font-weight: 100;
    padding:20px; text-align:center;
    
}
    .homepage-product:hover {
        background-color: #ebe3cd;
        cursor:pointer;
    }

    
/* search results and product display */
.product-slot {width:150px; background-color:red; text-align:center;padding:10px; background-color:#ebe4c8; float:left;
               margin:10px;

}
    .product-slot .wrap {
        height: 180px;
        width: 150px;
        overflow:hidden;
    }
.product-slot .wrap img {
    width:100%; height:auto;
}
    .product-slot .codeandtitle {height:40px; overflow:hidden;
        text-align: left;
    }
    .product-slot .priceandorder {
        text-align: left;
        margin-top: 5px;
    }
    .product-slot .orderbutton {float:right;
        background-color: #a9bb5a;
        border:none; color:#fff;
        height:25px;
        cursor:pointer;font-family: 'Roboto Condensed', sans-serif;
    }
    .product-slot .orderbutton:hover { background-color:#88993d;}


/* popup product div*/
div.popup
{
    position: relative;
    width: 750px;
    height:470px;
    margin: 0px auto;    
    z-index:1000; 
    text-align:left;
    padding:0px;
    overflow:hidden;
    
    
}


#productPopupFrame {
    width: 100%;
    height: 500px;    
    border: none;
    padding:10px;
}


.popupproduct-wrap {
        height: 450px;
        width: 350px;
        overflow:hidden;
        
    }
.popupproduct-wrap img {
    width:100%; height:auto;
}

.popupproduct-info {
    float: right;
    text-align: left;
    width: 370px;
     
    overflow:hidden;
    max-height:500px;   
}

.popupproduct-info h1 {
    font-family: 'Roboto Condensed', sans-serif; padding:0px; margin:0px;
}
    .popupproduct-info h2 {font-family: 'Roboto Condensed', sans-serif; padding:0px; margin:0px; color:#a99b7e; width:90%;}

.button-generic{
        background-color: #a9bb5a;
        border:none; color:#fff;
        height:25px;font-family: 'Roboto Condensed', sans-serif;
        cursor:pointer; margin-left:2px; margin-right:2px;}
.button-generic:hover { background-color:#88993d;}

.popupproduct-html {
    width:95%; overflow:hidden;
    min-height:188px;
    max-height:188px; overflow-y:scroll;
    padding-top:5px; padding-bottom:5px;
}

.popupproduct-orderstock {
    overflow: auto;
}
.order-qty-input {
    width: 70px; float:left;
    display:block;
    text-align:center;
    background-color:#eee;
    padding-bottom:5px;
    font-size:.7em;
    margin-right:5px; margin-top:5px;
}
.stockCode {
    width: 70px;
    text-align: center;
}
.order-qty-input input {
        width: 60px;        
        background-color:#a99b7e;
        border:none;
        text-align:center;
        font-family: 'Roboto Condensed', sans-serif;
        color:#fff;
    }
.stockSize {
    width: 40px;
    height:40px;
    float:left;
    text-align:left; 
    font-family: 'Roboto Condensed', sans-serif;
    font-weight:100;    
    font-size:.7em;
    background-color:red;
}

    

.stockAvaliable {
    
    margin-left:4px; background-color:#fff;padding:2px;
}

/*
    css + cms
*/

.cms-details h1 {
    width: 100px; display:inline-block;margin:0px; padding:0px; font-size:1.2em; font-weight:100;
    margin-bottom:10px; margin-left:10px;
}
.cms-details .txtInput,.cms-details #txHTML {font-family: 'Roboto Condensed', sans-serif; background-color:#ebe3cd; color:#333; border:none; font-size:1em;padding:5px; width:400px;}
.cms-details .ddlInput { background-color:#ebe3cd; color:#333; border:none; font-size:1em;padding:5px; width:410px; margin-left:-3px;}
.cms-details #txHTML {width:510px; height:80px;
}
.cms-details .cmsButton {
        background-color: #a9bb5a;
        border:none; color:#fff;
        height:25px;
        cursor:pointer;font-family: 'Roboto Condensed', sans-serif;
    }
    .cms-details .cmsButton:hover { background-color:#88993d;}

    /* authorised email addresses */
.emailList {
    list-style: none; padding-left:10px;
}
    .emailList li {
        display:block;
        width:300px; padding:3px;
    }
    .emailList li:hover {
        background-color: #ebe3cd;
    }
.emailBin {
    float: left; cursor:pointer; padding-right:10px;
}

/* footer */
#footerProducts {
    list-style: none;
}
    #footerProducts li {
        display: inline-block;
         height:30px;line-height:30px;
         font-style: normal;
    }

#footerProducts li a {  
   
    display: block;
    
    padding:5px;
    
    text-decoration:none;
    color:#333;
}
    #footerProducts li a:hover {
        background-color: #a99b7e; color:#fff;
    }

#pageFooter {
    width: 1000px;
    margin: 0 auto;
    margin-top: 20px;
    height: 90px;
    text-align: left;
    background-color: #fff;
    margin-bottom: 20px;
    text-align: center;
    color:#333;font-style: normal;
}

/* page document display */
.graphic-page-documents {
    width: 980px;
    text-align: center; overflow:hidden;
}
DIV.loader img {
    width: 600px;
    padding:10px;
    background-color:#333;
}

DIV.loader {
    width: 980px;
    margin: 0 auto;
    min-height: 100px;
    text-align: center;    
}
    DIV.loader.loading {
        background-image: url(/Assets/Graphics/loading-spinner.gif);
        background-position: center center;
        background-repeat: no-repeat;
    }