@font-face
{
    font-family: 'OpenSans';
    font-style: normal;
    font-weight: 400;
    src: local('OpenSans Regular'), local('OpenSans-Regular'), url('Fonts/OpenSans-Regular.woff') format('woff'), url(Fonts/OpenSans/OpenSans-Regular.ttf) format('truetype');
}

body
{
    font-size: small;
    font-family: 'OpenSans', sans-serif;
    margin: 0px;
    padding: 0px;
    color: #333333;
}

p, td, div
{
    font-size: small;
    font-family: 'OpenSans', sans-serif;
    color: #333333;
}

input, select, textarea
{
    color: #333333;
}

a:link, a:visited, a:active, a:hover
{
    color: #333333;
}

a:hover
{
    font-weight: bold;
}

img
{
    border: none;
}


/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6
{
    color: #000000;
    font-weight: bold;
    margin-bottom: 5px;
}

h1
{
    font-size: large;
}

h2
{
    font-size: medium;
}

h3
{
    font-size: small;
}

h4
{
    font-size: small;
}

h5, h6
{
    font-size: small;
    font-weight: 100;
}


/* LAYOUT   
----------------------------------------------------------*/

.container
{
    background: url(Images/BodyBG.jpg) no-repeat #ffffff;
    background-size: cover;
}

.header
{
    padding: 10px 20px 0px 20px;
    position: relative;
    min-height: 36px;
}

.logo
{
    vertical-align: bottom;
}

    .logo img
    {
        width: 50%;
        max-width: 394px;
        vertical-align: bottom;
    }

@media all and (max-width: 399px)
{
    .contentContainer
    {
        margin: 5px;
        background-color: rgba(255, 255, 255, 0.6);
    }
    
    .menu
    {
        position: absolute;
        bottom: 0px;
        right: 5px;
    }

}

@media all and (min-width: 400px)
{
    .contentContainer
    {
        margin: 20px;
        background-color: rgba(255, 255, 255, 0.6);
    }

    .menu
    {
        position: absolute;
        bottom: 0px;
        right: 20px;
    }

}

.content
{
    margin: 0px 10px;
    padding-bottom: 10px;
}

.footer
{
    background-color: rgba(0,0,0, 0.5);
    position: relative;
}

.footerContent
{
    padding: 10px 20px;
    color: #cccccc;
}

.footerDevelopedBy
{
    position: absolute;
    right: 20px;
    top: 10px;
    color: #cccccc;
}

    .footerDevelopedBy a, a.footerDevelopedBy
    {
        color: #cccccc;
        text-decoration: none;
    }

        .footerDevelopedBy a:hover, a.footerDevelopedBy:hover
        {
            font-weight: normal;
        }



/* MENU   
----------------------------------------------------------*/

/*Level1*/
.menuItems
{
    text-align: left;
    display: inline;
    margin: 0px;
    padding: 0px;
    list-style: none;
}

@media all and (min-width: 400px)
{
    .menuIcon
    {
        background: url(Images/Menu/Menu_32x32.png) no-repeat 50% 50%;
        height: 36px;
        width: 36px;
    }
}

@media all and (max-width: 399px)
{
    .menuIcon
    {
        background: url(Images/Menu/Menu_16x16.png) no-repeat 50% 50%;
        height: 20px;
        width: 20px;
    }
}

    .menuItems li
    {
        display: inline-block;
        position: relative;
        padding: 6px 12px;
        background-color: rgba(255, 255, 255, 0.5);
        cursor: pointer;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        -ms-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s;
    }

        .menuItems li:hover
        {
            background-color: rgba(0, 0, 0, 0.3);
            color: #ffffff;
        }

        /*Level2*/
@media all and (min-width: 400px)
{
    .menuItems li ul
    {
        padding: 0;
        position: absolute;
        top: 40px;
        right: 0px;
        width: 200px;
        display: none;
        opacity: 0;
        visibility: hidden;
        -webkit-transiton: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -ms-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;
        -transition: opacity 0.2s;
    }

        .menuItems li ul li a, a.menuItems li ul li
        {
            font-size: small;
        }
}

@media all and (max-width: 399px)
{
    .menuItems li ul
    {
        padding: 0;
        position: absolute;
        top: 25px;
        right: 0px;
        width: 150px;
        display: none;
        opacity: 0;
        visibility: hidden;
        -webkit-transiton: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -ms-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;
        -transition: opacity 0.2s;
    }
    
    .menuItems li ul li a, a.menuItems li ul li
    {
        font-size: x-small;
    }
}

            .menuItems li ul li
            {
                background-color: rgba(0, 0, 0, 0.5);
                display: block;
                color: #ffffff;
                text-shadow: 0 -1px 0 #000000;
            }

                .menuItems li ul li:hover
                {
                    background-color: rgba(0, 0, 0, 0.6);
                }

                .menuItems li ul li a, a.menuItems li ul li
                {
                    color: #ffffff;
                    font-weight: bold;
                    text-decoration: none;
                    display: block;
                }

                    .menuItems li ul li a:hover, a.menuItems li ul li:hover
                    {
                        color: #ffffff;
                    }

        .menuItems li:hover ul
        {
            display: block;
            opacity: 1;
            visibility: visible;
        }

        /*Level3*/
        .menuItems li ul li ul
        {
            padding: 0;
            position: absolute;
            top: 40px;
            right: 0px;
            width: 150px;
            display: none;
            opacity: 0;
            visibility: hidden;
            -webkit-transiton: opacity 0.2s;
            -moz-transition: opacity 0.2s;
            -ms-transition: opacity 0.2s;
            -o-transition: opacity 0.2s;
            -transition: opacity 0.2s;
        }

            .menuItems li ul li ul li
            {
                background-color: rgba(0, 0, 0, 0.5);
                display: block;
                color: #ffffff;
                text-shadow: 0 -1px 0 #000000;
            }

                .menuItems li ul li ul li:hover
                {
                    background-color: rgba(0, 0, 0, 0.6);
                }

                .menuItems li ul li ul li a, a.menuItems li ul li ul li
                {
                    color: #ffffff;
                    font-weight: bold;
                    text-decoration: none;
                    display: block;
                    font-size: x-small;
                }

                    .menuItems li ul li ul li a:hover, a.menuItems li ul li ul li:hover
                    {
                        color: #ffffff;
                    }

        .menuItems li ul li:hover ul
        {
            display: block;
            opacity: 1;
            visibility: visible;
        }

/*FORMS
----------------------------------------------------------*/

.fieldHeader
{
    font-weight: bold;
    font-size: medium;
    margin: 5px 0px;
    color: #0c85b2;
}

.field
{
    margin-bottom: 5px;
}

.fieldValidation, fieldValidation li /*validation*/
{
    color: #FF0000;
}

.fieldLabel
{
    font-weight: bold;
    text-align: left;
    color: #333333;
}

.fieldInput
{
    padding: 0px;
}

.fieldDisplay
{
    padding: 0px;
    color: #333333;
}

.fieldInfo
{
    color: #666666;
    font-size: x-small;
}

.subForm
{
    border: solid 1px #e1e1e1;
    padding: 20px;
    margin-bottom: 10px;
}

.primarySubFormColour
{
    background-color: #f5f5f5;
}

.secondarySubFormColour
{
    background-color: #ffffff;
}



/*BUTTONS
----------------------------------------------------------*/

.primaryButton
{
    color: #FFFFFF;
    padding: 5px 10px;
    background-color: #1486b2;
    border: none;
}

    .primaryButton:hover
    {
        color: #000000;
        cursor: pointer;
    }

.secondaryButton
{
    color: #000000;
    padding: 5px 10px;
    background-color: #cccccc;
    border: none;
}

    .secondaryButton:hover
    {
        color: #ffffff;
        cursor: pointer;
    }

a.primaryButton, a.secondaryButton
{
    color: #FFFFFF;
    text-decoration: none;
}




/*GRIDVIEW
----------------------------------------------------------*/


.mGrid {   
    background-color: #ffffff;   
    margin: 5px 0 10px 0;   
    border: solid 1px #525252;   
    border-collapse:collapse;
}
    .mGrid .mGridHeader {
        
    }
.mGrid tr
{
    transition: height 1s;
    -webkit-transition: height 1s; /* Safari */
}
.mGrid tr:hover
{
    border: solid 1px #969696;
    background-color: #dddddd;
}
.mGrid td {   
    padding: 2px;   
    border: solid 1px #c1c1c1;   
    color: #717171;   
}
/* style to remove borders from ajaxcontroltoolkit */
.mGrid td td
{
    border: none;
}

.mGrid th {   
    color: #ffffff;   
    background-color: #1486b2;
	/*background: -moz-linear-gradient(
		top,
		#d2dfdf 0%,
		#91c3c2);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#d2dfdf),
		to(#91c3c2));*/ 

    border: 1px solid #91c3c2;
    font-size: 12px;
    padding: 5px;
} 
.mGrid th a {   
    color: #fff;   
    background: url(Images/GridView/Sort.png) no-repeat 100% 50%;
    padding-right: 20px;
    text-decoration: none;
    display: block;
} 
.mGrid .mGridAlternatingRow { background: #f0f0f0 repeat-x top; }

.mGrid .mGridFooter td
{
    background-color: #C0C0C0;
    border: none;
    font-weight: bold;  
    color: #ffffff; 
}

.mGrid .mGridPager { background: #C0C0C0 repeat-x top; }  
.mGrid .mGridPager table { margin: 5px 0; }  
.mGrid .mGridPager td {   
    border-width: 0;   
    padding: 0 6px;   
    border-left: solid 1px #666666;   
    font-weight: bold;   
    color: #ffffff;   
    line-height: 12px;   
 }     
.mGrid .mGridPager a { color: #666666; text-decoration: none; }  
.mGrid .mGridPager a:hover { color: #000000; text-decoration: none; }



/*Processing
----------------------------------------------------------*/

.processingBackground
{
    width: 100%;
    height: 100%;
    background: #121212;
    opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */
}

.processing
{
    border: solid 2px black; 
    background-color: #d2dfdf;
    color: black;
    z-index: 1; 
    padding: 20px; 
    text-align: center;
}


/*Popup
----------------------------------------------------------*/

.panelpopup
{
	background-color: #d2dfdf;
	color: #969696;
	font-size: small;
	position: relative;
	
	/*--CSS3 Box Shadows--*/ 
    -webkit-box-shadow: 0px 0px 20px #000000; 
    -moz-box-shadow: 0px 0px 20px #000000; 
    box-shadow: 0px 0px 20px #000000; 
    /*--CSS3 Rounded Corners--*/ 
    -webkit-border-radius: 10px; 
    -moz-border-radius: 10px; 
    border-radius: 10px;
}

.popupClose
{
    float: right;
    margin: -10px -10px 0px 0px;
}

.popupDiv
{
    padding: 20px 10px;
}

.modalBackground
{
    background-color:Gray;
    filter:alpha(opacity=70);
    opacity:0.7;
}




/*GENERAL
----------------------------------------------------------*/

.defaultListHyperlink
{
    display: block;
    margin-bottom: 2px;
}

.centerText
{
    text-align: center;
}