/******************************************** Standard Structural Layout CSS3 ************************************

Author: Carl Pryke
Company: Occam Media
Version: 3.0    
Date: 19/12/2011    
Description: A standard layout for a website, restricted width of 1000px for content, page length flexible based on
             content size, centers itself based on page width.    
       
             Some important modifications involve: 
        
                1: literal addressing. The reason for this is that it explicitly addresses parts of the template without
                   effecting plugins.
                2: tag addressing - more concise addressing by using tags where classes are not needed
                3: Removal of ID use with the premise of not affecting plugins

******************************************************************************************************************/

/* Always make sure the margin is set to 0 */
body 
{
    margin: 0px 0px;
}

body img
{
    border: 0px;    
}

/* Outlines the window border, allowing us to capture the space, regardless of browser
   (there are issues in firefox that cause the body to be outside the window space)*/
body>div,
body>div>div.wrapper1
    {
        position: relative;
        overflow: hidden;
        float: left;
        min-width: 968px;
        width: 100%;
        min-height: 0px;
        z-index: 0; 
        text-align: center;
    }

/* Some additional layers, could use style attribute but prefer seperate css, use with wrappers */
body>div>div.main>div.wrapper1
{
    z-index: 10000; 
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
}
body>div.wrapper2{z-index: -1; position: absolute; height: 600px;}
body>div.wrapper3{z-index: 3;}

body h1,
body h2,
body h3
{
    float: left;
    font-weight: normal;
    color: #000;  
    text-align: left;  
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 10px;
    width: 100%;
}

body>div>div
{
    float: none;    
    position: relative;
    width: 968px;
    min-height: 0px;
    margin: 0px auto;
}

body>div>div>div
{
    width: 100%;
    height: 120px;
    min-height: 0px;
}

/************************************** Background *********************************************/

body>div.wrapper2>img
{
    position: absolute;
    top: 238px;
    left: 0px;    
    opacity: 0.0;
}


body h2>span
{
    color: #05683a;    
}

/************************************** Header *********************************************/

body>div>div.header
{
    text-align: center;
    height: 200px; 
    width: 100%;
    background-image: url('http://ecotechnologyshow.co.uk/images/header-repeat.png');  
    background-position: left 20px;
    background-repeat: repeat-x;
}

body>div>div.header>div
{
    float: none;
    position: relative;
    margin: 0px auto;
    width: 968px;
    height: 100%;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: left 18px;   
}

body>div>div.header>div>a>img
{
    margin-top: 13px;
    float: left;
    width: 258px;    
}

body>div>div.header>div>div
{
    float: right;
    width: 710px;
    height: 100%;    
}

body>div>div.header>div>div>div
{
    float: left;
    width: 47px;
    height: 47px;
    margin-left: 10px;
    background-repeat: no-repeat;
    margin-top: 10px;
    text-align: left;
    background-position: center left;
}

body>div>div.header>div>div>div.email{width: 320px; padding-left: 25px; margin-top: 20px; height: 25px;}
body>div>div.header>div>div>div.phone{width: 150px; padding-left: 25px; margin-top: 20px; height: 25px; margin-left: 90px;}

body>div>div.header>div>div.advert
{
    background-repeat: no-repeat;
    background-position: center center;
}

body>div>div.header>div>div>div.info
{
    float: left;
    margin-top: 35px;
    width: 490px;
    height: 70px;
}

body>div>div.header>div>div>div.info>div.left>div
{
    margin-top: 0px;
    font-size: 14px;    
}

body>div>div.header>div>div>div.info>div.left>div.dates
{
    width: 99%;
    padding-left: 1%;
    height: 27px;
    background-color: #36b449;
    color: #fff;
    font-size: 22px;
    margin-top: 0px;
}

body>div>div.header>div>div>a>div.register-button,
body>div>div>div.content>div>a>div.register-button,
body>div>div>div.content>div.enquiry-form>div.submit-button
{
    float: left;
    width: 205px;
    height: 27px;  
    margin-top: 35px;
    margin-left: 5px;
    text-align: center;
    background-color: #05683a;
    color: #fff;
    cursor: pointer;
    font-size: 21px;
    text-decoration: none;
    text-decoration-line: cancel-all;    
}

body>div>div>div.content>div>a
{
    text-decoration-line: cancel-all; 
    text-decoration: none;   
}

body>div>div>div.content>div.image
{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 10px;
    width: 100%;
    height: auto;
    min-height: 0px;    
}

body>div>div>div.content>div>a>div.register-button
{
    float: none;
    margin: 30px auto;
}

body>div>div>div.content>div.sponsors-listings
{
    float: left;
    width: 100%;
    min-height: 100px;
    padding-left: 0px;
    background: url('../../images/waiting-animation.gif');
    background-repeat: no-repeat;
    background-position: center center;    
}

body>div>div>div.content>div.sponsors-listings>div.image-list
{
    width: 95%;
    margin-left: 2.5%;
    min-height: 0px;    
}

body>div>div>div.content>div.sponsors-listings>div.image-list>h2
{
    width: 100%;
    min-height: 20px;
    float: left;    
}

body>div>div>div.content>div.sponsors-listings>div.image-list>div
{
	width: 200px;
	height: 140px;
	float: left;
	position: relative;
	margin: 10px 10px;
}

body>div>div>div.content>div.sponsors-listings>div.image-list>div>a>img
{
    max-height: 140px;
	max-width: 200px;
    height: auto;  
    width: auto;  
    position: relative;
	float: none;
    margin: auto auto;
}

body>div>div.header>div>div>a>div.register-button:hover,
body>div>div>div.content>div>a>div.register-button:hover{background-color: #36b449;}
/************************************** Navbar *********************************************/

body>div>div>div.navigation-bar
{
    height: 30px;
    margin-top: 60px;
}

body>div>div>div.navigation-bar>div
{
    min-width: 50px;
    float: left;   
    cursor: pointer;
    height: 30px;
    padding: 0px 15px 0px 16px; 
    margin: 0px 6px 0px 0px;
}

body>div>div>div.navigation-bar>div>a
{
    text-decoration: none;
}

body>div>div>div.navigation-bar>div>a>div
{
    width:  100%;
    height: 100%;
	padding: 4px 0px 6px 0px;
}

/************************************** Sub Nav *********************************************/

body>div>div>div.subnav
{
    float: left;
    position: relative;
    height: auto;
    min-height: 0px;
    background-color: #fff;
    padding-top: 20px;
}

body>div>div>div.subnav>a>div,
body>div>div>div>div.subnav>a>div
{
    float: left;
    padding-left: 25px; 
    color: #05683a;
    background-position: left center;
    background-repeat: no-repeat;
    background-image: url('../../images/bullet.png'); 
    margin: 10px 0px 3px 10px;
}

body>div>div>div>div.subnav>div
{
    float: left;
    width: 90%;
    margin-left: 5%; 
    margin-right: 5%;   
}

body>div>div>div.subnav>a>div.selected,
body>div>div>div.subnav>a>div:hover
{
    color: #36b449;
}


/************************************** Navbar *********************************************/

body>div>div>div.content
{
    height: auto;
    overflow: initial;
    padding-bottom: 40px;
    background-color: #fff;
    text-align: left;
    color: #000;
    display: inline-grid;
    float: left;
    position: relative;
}

body>div>div>div.content>div.summary-text img
{
    float: right;
    margin-left: 0px;
    margin-right: 0px;
    max-width: 920px;
}

body>div>div>div.content>div,
body>div>div>div.content>table
{
    float: left;
    width: auto;
    padding-left: 20px;  
    padding-right: 20px;
    margin-top: 5px;
    margin-bottom: 5px;  
}

body>div>div>div.content>div
{
    width: 95%;    
}

body>div>div>div.content>table
{
    border: 0px;
    margin-top: 30px;
    margin-bottom: 30px;    
}

body>div>div>div.content>table>tbody>tr>th
{
    font-weight: normal;
    color: #05683a;  
    padding-left: 30px;
    padding-right: 15px;  
}

body>div>div>div.content>img.banner
{
    margin-left: 10px;    
}

body>div>div>div>div.left,
body>div>div>div>div.middle,
body>div>div>div>div.right
{
    float: left;
    position: relative;
    width: 660px;
    height: auto;
    min-height: 0px; 
    padding-left: 20px; 
    padding-right: 0px;
}

body>div>div>div>div.middle
{
    width: 150px; 
    min-height: 600px;   
}

body>div>div>div>div.right
{
    float: right;
    width: 274px; 
    height: auto;
    margin-top: 10px;    
}

body>div>div>div>div.right>div,
body>div>div>div>div.right>a
{
    position: relative;
    width: 255px;
    height: 200px;
    margin: 5px 5px;  
    cursor: pointer;  
    
}

body>div>div>div>div.right img
{
	max-width: 95%;
}

body>div>div>div>div.right>div>a>img,
body>div>div>div>div.right>div>img
{
    position: absolute;
    max-width: 255px; 
    top: 0px;
    left: 0px;
    opacity: 0.0;
}

body>div>div>div>div.right>div.search
{
    height: 211px;
}

body>div>div>div>div.right>div.search>div
{
    width: 100%;    
    height: 77px;
}

body>div>div>div>div.right>div.search>div.location
{
    width: 268px;
    height: 50px;
    margin-left: 12px;
}

body>div>div>div>div.right>div.search>div.radios
{
    height: 40px;    
}

body>div>div>div>div.right>div.search>div.radios>div
{
    width: 35%;
    padding-left: 15%;
    float: left;    
    background-repeat: no-repeat;
    background-position: 10px center;
    height: 33px;
    padding-top: 7px;
    text-align: left;
}

body>div>div>div>div.right>div.search>div.radios>div.selected{background-image: url('../../images/radio-selected.png');}
body>div>div>div>div.right>div.search>div.radios>div.unselected{background-image: url('http://ecotechnologyshow.co.uk/images/radio-unselected.png');}

body>div>div>div>div.right>div.search>div.submit
{
    background-image: url('http://ecotechnologyshow.co.uk/images/search-button.png');
    background-repeat: no-repeat;
    background-position: 10px center;
    height: 36px;
    margin-left: 50px;  
}

body>div>div>div>div.right>div.search>div.submit:hover{background-image: url('http://ecotechnologyshow.co.uk/images/search-button-hover.png');}
body>div>div>div>div.right>div.search>div.submit:active{background-image: url('http://ecotechnologyshow.co.uk/images/search-button-down.png');}

/************************************** Footer *********************************************/

body>div.footer
{
    height: auto;
    min-height: 100px;
    text-align: center;
}

body>div.footer>div>div
{
    width: 100%;
    text-align: left;
    float: left;
    min-height: 0px;
    height: auto;
    margin: 5px 5px 0px 5px;
}

body>div.footer>div.strap
{
    height: 30px;
    margin: 0px 0px;
    width: 100%;
}

body>div.footer>div.sponsors
{
    float: none;
    position: relative;
    margin: 0px auto;
    width: 968px;
    height: auto;
    min-height: 0px;    
}

body>div.footer>div.footer-links
{
    position: relative;
    float: none;
    margin: 0px auto;
    width: 968px;
    height: 30px;    
    color: #000;
}

body>div.footer>div.footer-links>div
{
    width: auto;
    float: right;    
}

body>div.footer>div.footer-links>div.copyright
{
    float: left;    
}

body>div.footer>div.footer-links>div.occam-link>a
{
    text-decoration: none;
    color: #000;
    padding-left: 25px;
    background-image: url('../../images/occam-symbol.png');
    background-position: center left;
    background-repeat: no-repeat;    
    margin-left: 20px;
}

body>div.footer>div.footer-links>div>a,
body>div>div>div.content>div>a
{
    color: #36b449;    
}

body>div.footer>div>div.fb,
body>div.footer>div>div.tw
{
    width: 40px;
    height: 40px;
    top: -60px;
    position: absolute;  
    background-position: center center;
    background-repeat: no-repeat;  
    background-size: 100% 100%;
}

/**************************** Page Content ********************************/

body>div>div>div>div.left>div
{
    min-height: 0px;
    margin-top: 20px;
    float: none;
    color: #000;
    width: 100%;
    text-align: left;
}

body>div>div>div>div.left
{
    width: 638px;
    margin-top: 0px;    
}

body>div>div>div>div.left>div.title
{
    font-size: 40px;
}

body>div>div>div>div.left>div.main
{
    background-position: right top;
    background-repeat: no-repeat;    
    width: 618px;
}

body>div>div>div>div.left>div.main>div
{
   width: 250px;
    
}

body>div>div>div>div.left>div>div.header,
body>div>div>div>div.left>div.header
{
    font-size: 30px;
}

body>div>div>div>div.left>div>div.bullet,
body>div>div>div>div.left>div>div.bullet2,
body>div>div>div>div.left>div.bullet,
body>div>div>div>div.left>div.bullet2,
body>div>div>div>div.bullet,
body>div>div>div>div.bullet2
{
    float: left;
    padding-left: 30px;    
    margin: 10px 5px;
    width: auto;
    min-width: 86%;
    background-image: url('../../images/bullet.png');
    background-position: left 3px;
    background-repeat: no-repeat;
}

body>div>div>div>div.bullet,
body>div>div>div>div.bullet2
{
    margin: 10px 20px 10px 20px;    
}

body>div>div>div>div b,
body>div>div>div>div b
{
    font-size: 18px;
    color: #36b449;
}

body>div>div>div>div.left>div>div.bullet2,
body>div>div>div>div.left>div.bullet2,
body>div>div>div>div.bullet2
{
    margin: 10px 20px 10px 40px;
    background-image: url('../../images/bullet2.png');
}

body>div>div>div>div.left a
{
    color: #508384;    
}

/************************************* Enquiry Form ******************************/

body>div.wrapper>div>div.content>div.enquiry-form>input,
body>div.wrapper>div>div.content>div.enquiry-form>select,
body>div.wrapper>div>div.content>div.enquiry-form>h1,
body>div.wrapper>div>div.content>div.enquiry-form>h2,
body>div.wrapper>div>div.content>div.enquiry-form>div
{
    width: 250px;
    min-height: 30px;
    vertical-align: central;
    text-align: left;
    float: left;
    margin-top: 10px;
    margin-right: 250px;
}

body>div.wrapper>div>div.content>div.enquiry-form>h1,
body>div.wrapper>div>div.content>div.enquiry-form>h2
{
    width: 95%;  
    border-bottom: 1px dotted #555;
    padding-bottom: 10px;  
}

body>div.wrapper>div>div.content>div.enquiry-form>div
{
    display: none;
    width: 400px;
    margin-right: 150px;    
}

body>div.wrapper>div>div.content>div.enquiry-form>div.instruction
{
    display: block;
    width: 95%;    
}

body>div.wrapper>div>div.content>div.enquiry-form>div.submit-button
{
    float: none;
    margin: 0px auto;
    width: 186px;
    height: 30px;
    background-image: url('http://ecotechnologyshow.co.uk/images/submission-button.png');   
    background-repeat: no-repeat;
    background-position: center center;
    text-align: center;
    display: block; 
    margin-top: 50px;
}

body>div.wrapper>div>div.content>div.enquiry-form>div.waiting
{
    display: block;
    float: none;
    width: 100%;
    height: 100px;
    margin-top: 50px;
    background-image: url('../../images/waiting-animation.gif'); 
    background-repeat: no-repeat;
    background-position: center center;   
}

body>div.wrapper>div>div.content>div.enquiry-form>div.submit-button:hover{background-image: url('http://ecotechnologyshow.co.uk/images/submission-button-over.png');}

body>div.wrapper>div>div.content>div.enquiry-form>textarea
{
    float: none;
    margin-right: 300px;
    width: 600px;
    height: 300px;
    margin-top: 10px;    
}

/********************************************* Login Box ***************************************************************/

body>div.wrapper>div>div.content>div.login-box
{
    width: 100%; 
    min-height: 150px;   
}

body>div.wrapper>div>div.content>div.login-box>input
{
    float: left;
    height: 30px;
    width: 200px;
    margin-right: 5px;
}

body>div.wrapper>div>div.content>div.login-box>div
{
    float: left;    
}

body>div.wrapper>div>div.content>div.login-box>div.login-button
{
    width: 200px;
    height: 27px;
    margin-top: 3px;
    padding-top: 3px;
    text-align: center;
    background-color: #05683a;   
    color: #fff; 
    cursor: pointer;
}

body>div.wrapper>div>div.content>div.login-box>div.login-button:hover
{
    background-color: #36b449;    
}


body>div.wrapper>div>div.content>div.news-feed
{
    min-height: 100px;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url('../../images/waiting-animation.gif');    
}