@font-face {
    font-family: 'museo-slab-300';
    src: url('Fonts/museo-slab-300.eot') format('embedded-opentype');
    src: url('Fonts/museo-slab-300.ttf') format('truetype');
    src: url('Fonts/museo-slab-300.woff') format('woff');
}

@font-face {
    font-family: 'Kalam-Regular';
    src: url('Fonts/Kalam-Regular.ttf') format('truetype');
}


element.style {
}

#imgSFA{ float:right; padding-top:10px; }
#MATTLogo{ display: block; margin-left: 43.25%; padding-top: 90px;}

.containerMATT { background:url(../images/bg-bottom.jpg) repeat-x bottom center; overflow:auto; }
.homepage { width:960px; padding-top: 30px; padding-bottom:60px; /*overflow:auto;*/ margin:0 auto; }
.homepageText { text-align: justify; }
.strongText { font-weight: 900; }

.headerSection { padding-bottom: 50px; background: url(../images/pattern-orange.jpg) repeat-x; }
.headerGradient {
    background: linear-gradient( rgba(151, 215, 0, 0.75), rgba(151, 215, 0, 0.75) );
    height: auto;
    width: 100%;
    content: '';
    position: absolute;    
}

/*Top Navigation Bar*/
.topNavItem { display: flex; justify-content: space-around; list-style: none; padding-top:20px; margin-bottom:-7px;}
.topNavItem a { font-family: 'Kalam-Regular'; font-size: 20px; font-weight: 700; color: #FFF; text-decoration:none;}
.navText { padding-left: 2px; }

/*Navigation Bar*/
.navSection { background-color: #41b6e6; height:auto;}
.nav {justify-content: space-around; text-align: center; padding-bottom: 10px;display: flex;flex-wrap: wrap;padding-left: 0;margin-bottom: 0; list-style: none;}
.navItem{ margin-top: -30px;}
.text a { font-family: 'Kalam-Regular'; height: 80px; font-size:36px; font-weight:800; color: #FFF; text-decoration:none; }

/*Footer*/
.footer { background:#d6dbdf top center; height:auto; padding: 20px 50px; font-family: 'museo-slab-300'; font-size:16px; }
.footer ul { padding: 0px; }
.footer li { list-style:none; padding-bottom: 5px;}
.footer a { text-align:left; color:#000; text-decoration:none; }
.footerImage { padding-left: 20px; }
.h6Text { font-weight: 600; font-size: 18px; }

/*Gridview*/
.gridBorder { border: solid 2px #D3D3D3; height: 40px; }
.gridViewHeader { font-size: 14px; font-weight: 600;}
.gridHeaderPadding > th{padding-top:15px}
.gridViewItem { background-color: #F4FBEC; }
.gridViewAlternateItem { background-color: #FFF; }
.gridViewPaging { text-align: center; height: 20px; }
.gridViewPaging span { color: #ffa300; font-size: 20px; font-weight: 500; padding: 5px 10px 0px; }
.gridViewPaging a { color: #ffa300; font-size: 20px; padding: 5px 10px 0px; }
.filterByRow { background-color: #DAF4FC; height: 50px; }
.filterByText { color: #000; font-size: 16px; padding: 3px 0 0 20px; text-decoration:none; }
.courseTitle { padding: 30px 0; color: #000; font-size: 18px; }
.courseHeader { color: #41b6e6; font-weight: 700; font-size: 18px; padding: 20px; }
.blueColorText {color: #41b6e6; }
.rightAlignHeader { text-align: right; }
.greenBottomBorder { border-bottom: solid 3px #97D700; }
#tdGridView > div > table > tbody > tr > th { padding: 15px 0px;}

.AAReport { border-style: solid; border-width: 2px 0px 2px 0px; border-color: #D3D3D3; background-color: #F4FBEC; height: 50px; }
.trAAReport{ height: 70px; }
.tdAAReport { height: 40px; width: 40%; }

.LogInButton {
    background-color: #97D700;
    width: 80px;
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    border: solid 1px #97D700;
    border: solid 1px #97d700;

   
}

.btn-shdw-rad {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: inset 0px -2px 1px rgba(0,0,0,0.8), inset 0 2px 1px rgba(255,255,255,1);
    margin: 15px 5px;
}

.ddl {
    font-family: 'museo-slab-300';    
    height: 30px;
    border: 2px solid #41b6e6;
    border-radius: 3px;
    padding: 3px;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url('../images/TriangleDown.png');
    background-position: right;
    background-repeat: no-repeat;
}

body {    
    font-size: 16px;
    font-family: 'museo-slab-300';
    margin: 0px;
    padding: 0px;
}

.page
{
    width: 960px;
    margin: 20px auto 0px auto;
    border: 0px solid #D4B179;
    position:static
}

.header {
    position: relative;
    margin: 0px;
    padding: 0px;    
    width: 100%;
    font-family: Kalam-Regular;
    font-size: 16px;
    font-weight: bold;
    color: #7b382a;
}

.header h1 {
    font-weight: bold;
    margin: 0px;
    padding: 0px;
    color: #61402c;
    border: none;
    font-size: 12px;
    font-family: Kalam-Regular;
}

.main
{
    padding: 0px 12px;
    margin: 12px 8px 8px 8px;
    min-height: 600px;
}
.missedfieldalert {
    font-family: Kalam-Regular;
    font-style: italic;
    font-size: 13px;
    color: #ce6029;
}
.notice {
    font-family: Kalam-Regular;
    font-style: italic;
    font-size: 12px;
    color: #ee7a00;
    text-decoration: underline;
}
.h2 {
    font-weight: 400;
    font-size: 25px;
    color: #cf5f28;
    padding: 10px 0 6px 0;
}
.h3 {
    color: #7b382a;
    font-weight: bold;
    font-size: 16px;
    padding: 3px 0;
}

.BlackHead1 { color: #000; font-weight: 700; font-size: 20px; padding: 50px 0 10px; text-align:left; }
.BlueHead { color: #41B6E6; font-weight: 700; font-size: 14px; padding: 0px;  }
.BlueHead:hover { text-decoration: none; color: #41B6E6;}
.BlueHead1 { color: #41B6E6; font-weight: 700; font-size: 20px; }
.GreenHead { color: #97D700; font-weight: 700; font-size: 20px; padding: 0 20px; }
.RedHead2 { color: #A53128; font-weight: 700; font-size: 20px; padding: 0px 0; text-align:left; }
.GreenHead1
{
    color: #516129;
    font-weight: 600;
    font-size: 16px;
    padding: 3px 0;
}
.BrownHead1
{
    color: #7B382A;
    font-weight: 700;
    font-size: 18px;
    padding: 3px 0;
}
.BrownHead2 { color: #7B382A; font-weight: 700; font-size: 14px; padding: 3px 0; }
.OrangeHead1 { color: #CE6029; font-weight: 600; font-size: 16px; padding: 3px 0; text-decoration:none; }

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

#navigation { font-size:0.85em; width:100px; }
#navigation ul { margin-left:0px; padding:0px; }
#navigation li { list-style: none; }

ul.top-level {   
    font-family: 'museo-slab-300', Kalam-Regular;
    font-size: 13px;
    font-weight: 500;
    width: 75px;
}

ul.top-level li
{
    background-image: url('../images/bgMenu1.jpg');
    border-bottom: #fff solid;
    border-top: #fff solid;
    border-top-width: thin;
    border-bottom-width: thin;
}

#navigation a {
     color: #fff;
     cursor: pointer;
     display:block;
     height:35px;
     line-height: 35px;
     text-indent: 10px;
     text-decoration:none;
     width:100%;
}
#navigation a:hover{
    text-decoration:underline;
}

#navigation li:hover {
 background: #f90;
 position: relative;
}
/*first level*/
ul.sub-level {
    display: none;
}
li:hover .sub-level {
    background: #999;
    border: #fff solid;
    border-width: 1px;
    display: block;
    position: absolute;
    left: 75px;
    top: 5px;
}
ul.sub-level li {
    border: none;
    float:left;
    width:100px;
}
/*Seconda Level*/
#navigation .sub-level {
    background: #999;
}

/*Third Level*/
#navigation .sub-level .sub-level {
    background: #09C;
}
/*RESET STYLES*/
li:hover .sub-level .sub-level {
	display:none;
}
.sub-level li:hover .sub-level {
	display:block;
}

.watermark {
	background: #FFAAFF;
}

.popupControl {
	background-color:#AAD4FF;
	position:absolute;
	visibility:hidden;
	border-style:solid;
	border-color: Black;
	border-width: 2px;
}

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

.modalPopup {
	background-color:#fff;
	border-width:3px;
	border-style:solid;
	border-color:Gray;
	padding:3px;
	width:250px;
}

.degHrs, .artHrs {text-align: center;}
.btnRpt {width: 150px;background-color: #97D700;color: #fff;font-size: 16px;font-weight: bold;}
.btnRpt:hover {background-color: #3e8e41;}

.btn-rpt {
    width: 150px;
    font-style: italic;
    font-size: 12pt;
    color: White;
    border-width: 1px;
    border-style: Solid;
    background-color: #319531;
}