﻿/*Note - not using a full css reset since we are using a css framework*/
ul {
    list-style:none;
    margin:0;
    padding:0;
}

img {
    /*max-width: 100%;*/   
    max-width: 100%;
    max-height: 100%;
}


/* #region Header */

.templateHeader {
    font-weight:bold;
    font-size:1em;
    text-align:left;
}

/* #endregion Header */

/* #region Validation */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}

.validationred {
    color: red;
}
/* #endregion Validation */

#mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
	font-family: "xsmall"; /*work around for IE8, delete when we don't support it anymore*/
}
#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
    content: "xsmall";
    display: none;
}

    #map_canvas {
        height: 17em;
    }

/*Phone/Landscape STYLES*/
@media (min-width:26.25em), print /*420/16*/
{
    #mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
		font-family: "small"; /*work around for IE8, delete when we don't support it anymore*/
	}
	#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
        content: "small";
        display: none;
    }
    #map_canvas {
        height: 17em;
    }
}

/* tablet STYLES*/
@media (min-width:37.5em), print /*600/16*/
{
    #mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
		font-family: "medium"; /*work around for IE8, delete when we don't support it anymore*/
	}
	#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
        content: "medium";		
    } 
    #map_canvas {
        height: 40em;
    }

}

/*DESKTOP STYLES*/
@media (min-width:64em)  /* 1024/16 breakpoint four */
{
    #mediaquery{ /*do not change or delete, used for css and javascript breakpoint coordination*/
		font-family: "large"; /*work around for IE8, delete when we don't support it anymore*/
	}
	#mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
        content: "large";
    }  
    #map_canvas {
        height: 40em;
    }
    /* #region Footer */
    

    /* #endregion Footer */


    .member-list {
        list-style: none;
        padding: 0;
        margin: 10px 0;
    }

        .member-list li {
            margin-bottom: 10px;
        }

    #map-info {
        width: 30%;
        float: left;
        padding-top: 40px;
        margin-right: 2%;
    }

    #map-area {
        float: left;
        width: 68%;
        margin-bottom: 30px;
    }

        #map-area .ui-controlgroup-label {
            width: 160px !important;
            margin-top: 2px;
        }

}

/* Large screens ----------- */
@media (min-width : 114em) /*1824/16*/
{
    #mediaquery { /*do not change or delete, used for css and javascript breakpoint coordination*/
        font-family: "xlarge"; /*work around for IE8, delete when we don't support it anymore*/
    }

        #mediaquery:after { /*do not change or delete, used for css and javascript breakpoint coordination*/
            content: "xlarge";
        }

    #map_canvas {
        height: 40em;
    }
    #map-info {
        width: 20%;
    }

    #map-area {
        width: 78%;
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}