﻿.row { margin: 0; }


/*header*/
.header { position: relative; z-index: 2; min-height: 250px; width: 100%; }

    .header .row img { width: 100%; margin-top: 10px; /*height: 95px;*/ }

.altNav { float: right; clear: both; display: inline-block; margin-right: 20px; }
    .altNav ul { margin: 0; padding: 0; list-style-type: none; }
    .altNav li { float: left; width: 160px; display: block; }
    .altNav a { display: block; padding: 8px; color: white; text-align: center; text-shadow:1px 1px #000; }
        .altNav a:hover { background-color: #fb5324; text-decoration: none; }

/*.nav { float: left; clear: both; display: inline-block; font-size: 32px; }
    .nav ul { margin: 0; padding: 0; list-style-type: none; }
    .nav li { float: left; margin-left: 68px; margin-top: 12px; width: 185px; display: block; }
        .nav li a { display: block; padding: 0; color: white; font-size: 40px; }
    .nav .about { width: 150px; }
    .nav a:hover { background-color: #fb5324; text-decoration: none; }*/

.bannerContainer { float:left; width: 100%; max-height:718px; }

.banner { position: relative; z-index: 1; width: 100%; float: left; margin-top: -250px; }
    .banner img { width: 100%; float: left; }

.smallbanner { position: relative; z-index: 1; width: 100%; float: left; height:250px; margin-top: -250px; overflow:hidden; }
    .smallbanner img { width: 1920px; height:250px; float: left; position:absolute; top:0; left:0; }



/*Participation Fees*/
.partFees { width:70%; padding:0; display:block; margin:0 auto; margin-bottom:40px; }
    .partFees > div {  }
        .partFees > div h4 { background: #fb5324; padding: 10px; margin: 0; color: #fff; border: 1px solid #fb5324; }
        .partFees > div p { padding: 10px 40px; font-size: 16px; text-align: left; border: 1px solid #000; margin:0; border-top:none; }
            .partFees > div p span { float:right; }


.image p { width:64%; }
.image img { width:30%; margin-top:120px; margin-right:40px; float:right; }


.buttonFees { width:70%; margin:0 auto; display:block; margin-bottom:40px; }
    .buttonFees h4 { font-size:20px; font-weight:600; }
    .buttonFees .btn { background: #fb5324; padding: 10px 30px; color:#fff; font-weight:600; margin-right:10px; }
        .buttonFees .btn:hover { background: #000; }



@media only screen and (max-width: 1024px) {
    .image p { width:61%; }

}

@media only screen and (max-width: 826px) {
    .image p { width: 100%; }
    .image img { margin:0; width:100%; }
}

@media only screen and (max-width: 812px) {
    .partFees { width:90%; }
}

@media only screen and (max-width: 767px) {
    .header .logo { text-align: center; }
        .header .logo img { width: 145px; margin: 20px auto 45px; height: 61px; }

    .banner img { margin-top: -183px; }

    .altNav { float: right; clear: both; display: inline-block; margin-right: 20px; }
        .altNav ul { margin: 0; padding: 0; list-style-type: none; }
        .altNav li { float: left; width: 123px; display: block; }
            .altNav li a { font-size: 12px; padding: 0; width: 123px; }
}

@media only screen and (min-width:0px) and (max-width: 767px) {
    .noPad { padding: 0; }
    .banner { margin: -220px 0 0; padding: 0; height: 220px; position: relative; float: left; }
        .banner img { margin: 0; padding: 0; position: absolute; top: 0; bottom: 0; right: 0; width: auto; height: 220px; }
}

@media only screen and (max-width: 646px) {
    .partFees > div p { font-size:15px; padding:30px; }
    .buttonFees .btn { display:block; margin-bottom:10px; }
}

@media only screen and (min-width:0px) and (max-width: 608px) {
    .header { /*height: 300px;*/ }
        .header .logo { text-align: center; }
            .header .logo img { width: 98px; margin: 10px auto 20px; height: 30px; }

    .banner { height: 300px; margin-top: -300px; }
        .banner img { height: 300px; }

    .altNavigate { width: 100%; height: 69px; }
        .altNavigate .altNav { margin: 0 auto; padding: 0; width: 100%; margin-top: -6px; display: inline-block; }
            .altNavigate .altNav li { width: 100%; text-align: center; margin-top: 5px; margin-bottom: 5px; background: #fb5324; }
                .altNavigate .altNav li a { font-size: 12px; display: inline-block; width:100%; padding: 3px 0; }
                .altNavigate .altNav li:hover { background: white; }
                .altNavigate .altNav li a:hover { background: white; color: #fb5324; }
}

@media only screen and (max-width:480px) {
    .smallbanner { /*margin-top: -298px;*/ }
        .smallbanner img { left:-440px; }
}

@media only screen and (min-width:609px) and (max-width: 767px) {
    .header { height: 300px; }
        .header .logo { text-align: center; }
            .header .logo img { width: 177px; margin: 10px auto 20px; height: 54px; }

    .banner { height: 300px; margin-top: -300px; }
        .banner img { height: 300px; }

    .altNavigate { width: 100%; height: 55px; margin: 0 auto; background-color: #fb5324; }
        .altNavigate .altNav { margin: 0; padding: 0; width: 100%; }
            .altNavigate .altNav li { width: 33.33%; }
                .altNavigate .altNav li a { font-size: 12px; width: 100%; height: 55px; padding: 20px; }
                .altNavigate .altNav li:hover { background: white; }
                .altNavigate .altNav li a:hover { background-color: white; color: #fb5324; }
}

@media only screen and (min-width:480px) and (max-width: 767px) {
    .header { height: auto; }
    .banner { height: auto; margin: -250px 0 0; }
        .banner img { height: auto; width: 100%; position: relative; }
}


@media only screen and (min-width:768px) and (max-width: 1024px) {

    .noPad { width: 73%; position: relative; padding: 0; }

    .logo { height: 77px; width: 177px; padding: 0; margin-left: 36px; margin-top: 1px; }
        .logo img { /*height: 100%;*/ width: 100%; }

    .altNav { margin-right: 20px; margin: 0; margin-top: 0; width: 665px; }
        .altNav ul { margin: 0; padding: 0; list-style-type: none; }
        .altNav li { float: left; width: 25%; display: block; }
        .altNav a { display: block; padding: 8px; color: white; text-align: center; font-size: 11px; }
            .altNav a:hover { background-color: #fb5324; text-decoration: none; }

    .menu ul li a { font-size: 25px; }
}

@media only screen and (min-width:768px) and (max-width: 864px) {

    .noPad { width: 71%; }
    .altNav { width: 581px; }
    .menu .stMenu li { width: 18%; }
    .menu { padding-right: 20px; }
}









/*.nav { float: left; clear: both; display: inline-block; font-size: 32px; }
        .nav ul { margin: 0; padding: 0; list-style-type: none; }
        .nav li { float: left; margin-left: 0; margin-top: 12px; width: 185px; display: block; }
            .nav li a { display: block; padding: 0; color: white; font-size: 20px; }
        .nav .about { width: 150px; }*/


/* header - navigation */
/*-- Default Navigation Rules --*/
.menu { width: 100%; max-width: 1685px; margin: 0 auto; clear: both; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
    .menu ul { position: relative; z-index: 1; display: none; width: 100%; margin: 0 auto; float: none; padding: 0; list-style: none; }
        .menu ul li { display: inline-block; }
            .menu ul li a { color: #fff; text-decoration: none; padding: 10px 5px; display: block; font-size: 14px; }

        .menu ul.stMenu { display: none; text-align: right; }
            .menu ul.stMenu li a { padding: 10px 25px 0; display: block; font-size: 28px; line-height: 79px; text-shadow:1px 1px #000; }
            .menu ul.stMenu > li:hover > a { text-shadow: 1px 1px 1px #000; color: #fb5324; text-decoration: none; }
            .menu ul.stMenu li:last-of-type a { padding-right: 28px; }
            .menu ul.stMenu li ul { position: absolute; display: none; background-color: #aa7277; width: 200px; overflow: hidden; height: auto; padding: 0; }
                .menu ul.stMenu li ul li { float: left; width: 100%; line-height: normal; }
                    .menu ul.stMenu li ul li:hover { background: #635853; }
                    .menu ul.stMenu li ul li a { text-decoration: none; color: #fff; text-shadow: none; padding: 10px; display: block; float: left; clear: both; width: 100%; }

                        .menu ul.stMenu li ul li a:hover { color: #fbe3a9; }
                    .menu ul.stMenu li ul li ul { position: relative; display: block; }

    .menu .mobileMenu { display: none; }
        .menu .mobileMenu::before { display: none; content: "Menu"; color: #fff; float: left; clear: both; width: 100%; padding: 0; font-size: 32px; text-indent: 45px; background: #fb5324 url('../images/menu-icon.png') left center no-repeat; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; position: relative; z-index: 9999; }

    .menu ul.stMobileMenu { display: none; float: none; clear: both; width: 100%; overflow: hidden; margin: 0 auto; position: relative; height: auto; padding: 0; }
        .menu ul.stMobileMenu li { float: left; clear: both; display: block; width: 100%; background-color: #635853; margin: 2px 0; }
            .menu ul.stMobileMenu li a { color: #fff; }

            .menu ul.stMobileMenu li ul { position: relative; width: 100%; background: #a94c44; padding: 0; display: none; }
            .menu ul.stMobileMenu li li { color: #fff; list-style: none; }
                .menu ul.stMobileMenu li li a { padding: 10px 21px; border-bottom: 1px solid #666; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
                    .menu ul.stMobileMenu li li a:hover { color: #333; }
        .menu ul.stMobileMenu a.activePg { color: #000; float: left; clear: both; width: 100%; text-shadow: 1px 1px 1px #999; }
            .menu ul.stMobileMenu a.activePg:hover { color: #333; }

.open-img { background-image: url('../images/open-arrow.png'); background-repeat: no-repeat; background-position: 100% -2px; background-size: 46px; }
.closed-img { background-image: url('../images/close-arrow.png'); background-repeat: no-repeat; background-position: 100% -2px; background-size: 46px; }

.menu ul li.dropdown:before,
.menu ul li.dropdown.shown:before { position: absolute; top: 10px; right: 5px; display: block; color: #999999; }
.menu ul li.dropdown:before { content: "(+)"; letter-spacing: 1.4px; }
.menu ul li.dropdown.shown:before { content: "(-)"; letter-spacing: 2.6px; }

@media only screen and (max-width: 767px) {
    .menu ul.stMenu { display: none; }
    .menu .mobileMenu,
    .menu .mobileMenu::before { display: inline-block; cursor: pointer; width: 100%; }
    .menu.homePg div.mobileMenu { display: none !important; }
    .menu.homePg ul.stMobileMenu { display: block !important; }
}




@media only screen and (min-width: 768px) {
    .menu ul.stMenu { display: block; }
        .menu ul.stMenu li a { font-size: 16px; margin-right: 5px; }
}

@media only screen and (min-width: 1024px) {
    .menu ul.stMenu { display: block; }
        .menu ul.stMenu li a { font-size: 20px; }
}




/*content*/
form { float:left; width:100%; }
.content {  padding-bottom: 10px; min-height:581px; }

/*default2016 page*/
.pastQualifiers { height: 228px; }
    .pastQualifiers p { height: 61px; width: 37%; margin-top: 71px; padding-left: 45px; }
    .pastQualifiers .qualifiers { height: 197px; width: 63%; padding: 25px 0; vertical-align: middle; }
        .pastQualifiers .qualifiers > img { width: 100%; max-width: 1213px; margin-right: -4px; }
        .pastQualifiers .qualifiers .divsionGroup { display: none; }

@media only screen and (max-width: 767px) {
    .pastQualifiers { }
        .pastQualifiers p { width: 100%; padding: 0; margin-top: 20px; }
        .pastQualifiers .qualifiers { width: 100%; }
}

@media only screen and (min-width: 320px) and (max-width: 479px) {
    .pastQualifiers { height: 175px; }
        .pastQualifiers p { font-size: 11px; margin-bottom: -12px; text-align: center; }
        .pastQualifiers .qualifiers { height: 128px; }
}

@media only screen and (min-width: 768px)and (max-width: 821px) {
    .pastQualifiers p { margin-top: 48px; padding-left: 29px; font-size: 9px; }
}

@media only screen and (min-width: 822px)and (max-width: 1024px) {
    .pastQualifiers p { margin-top: 54px; padding-left: 14px; font-size: 10px; }
}

@media only screen and (min-width: 1024px)and (max-width: 1212px) {
    .pastQualifiers p { margin-top: 61px; padding-left: 18px; font-size: 12px; }
}



/*brackets*/
.scheduleResults { /*height: 710px;*/ display: block; width: 100%; margin: 0 auto; font-size: 17px; }
    .scheduleResults .title { background: #fb5324; color: white; width: 100%; height: 30px; padding-top: 5px; padding-left: 40px; font-weight: bold; }
    .scheduleResults .list { /*width:50%; padding-left:40px;*/ font-size: 13px; float: left; }
        .scheduleResults .list .name { color: #fb5324; text-decoration: underline; font-weight: bold; font-size: 13px; }


    .scheduleResults .listImg { }
        .scheduleResults .listImg img { width: 98%; max-width: 370px; margin: 10px; }

    /*Boys bracket*/
    .scheduleResults .boys { padding: 0 10px; }
        .scheduleResults .boys > div { width: 100%; float: left; margin-bottom: 15px; }

    /*Girls bracket*/
    .scheduleResults .girls { padding: 0 10px; }
        .scheduleResults .girls > div { width: 100%; float: left; margin-bottom: 15px; }

@media only screen and (min-width: 320px) and (max-width: 608px) {
    .row .listImg { display: none; }
    .row .list { width: 100%; margin: 0 auto; float: none; font-size: 12px; }
}

@media only screen and (min-width: 609px) and (max-width: 767px) {

    .row .list { font-size: 11px; }
}

@media only screen and (min-width: 992px) and (max-width:1280px) {
    .row .list { font-size: 11px; width: 60%; }
    .row .listImg { width: 40%; }
}


@media only screen and (min-width: 320px) and (max-width: 479px) {
    .scheduleResults { margin: 0; }
        .scheduleResults p { margin: 0; margin-bottom: 4px; }
        .scheduleResults .boys { width: 100%; height: 442px; }
        .scheduleResults .girls { width: 100%; height: 442px; }

        .scheduleResults .title { width: 100%; }
}
/*END Default2016.aspx*/

/*Schedule2016.aspx*/
.schedule { width: 100%; cursor: default; }
    .schedule p { font-size: 28px; color: #666; padding-left: 40px; margin-top: 25px; }
        .schedule p span { color: #fb5324; }

#accordian { text-align: center; }
.scheduleTab { width: 80%; border: 1px solid black; margin: 0 auto; background: #fb5324; margin-top: 5px; margin-bottom: 10px; padding-bottom: 7px; cursor: pointer; }
    .scheduleTab:first-of-type { margin-top: 55px; }

    .scheduleTab:hover { box-shadow: 5px 5px 0 grey; background: #f83b06; }
    .scheduleTab h3 { padding-left: 20px; color: #fff; }

.scheduleDD { width: 80%; margin: 0 auto; border: 1px solid black; margin-bottom: 10px; cursor: default; }
.scheduleTitle { padding-left: 40px; background: black; color: #fff; }
.scheduleDD .scheduleContent { padding-left: 40px; }

/*AAU_MEET.aspx*/
.scheduleImg img { margin-top: 20px; margin-right: 20px; float: right; width: 35%; }
.districtMeet { padding-left: 40px; }
.aauSchedule { width: 100%; cursor: default; }
    .aauSchedule p { font-size: 28px; color: #666; padding-left: 40px; margin-top: 25px; }
        .aauSchedule p span { color: #fb5324; }
.scheduleDownload { margin-left: 40px; width: 200px; height: 40px; background: #fb5324; margin-bottom: 20px; padding: 10px 0; text-align: center; }
    .scheduleDownload a { width: 200px; height: 100%; color: #fff; text-decoration: none; padding: 12px 37px; }
    .scheduleDownload:hover { box-shadow: 5px 5px 0 grey; background: #f83b06; }
.qualifyingMeet { width: 250px; margin-left: 40px; border: 1px solid black; }
    .qualifyingMeet .scheduleTitle { padding-left: 5px; }
    .qualifyingMeet .scheduleContent { padding-left: 5px; }
.orderEvents { width: 100%; }
    .orderEvents h3 { padding-left: 40px; }
.events { width: 70%; border: 1px solid black; margin-left: 40px; display: inline-block; }
    .events .running { padding: 0; }
        .events .running p { padding-left: 5px; }
    .events .field { padding: 0; }
        .events .field p { padding-left: 5px; }
    .events p { margin-bottom: 10px; padding-left: 5px; }
    .events .eventsTitle { background: black; color: white; }
    .events .eventsContent { }
    .events .guidlines { width: 100%; padding-top: 20px; float: left; }

/*video.aspx*/
.news .video { background: black; width: 70%; margin: 0 auto; }
.news .videoSelect { background: black; color: white; }
.news ol { border: 1px solid black; width: 70%; margin: 0 auto; }
.news ol li { padding:5px 0; }

/*participationFees.aspx*/
.subheaderwhite { color: white; }

/*about.aspx*/

/*site_map2016.aspx*/
.siteMap img { width: 100%; padding: 20px; }

/*contact.apsx*/

.title { width:100%; margin:0 auto; }
.title h1 { font-size: 28px; color: #666; }
.title h1 span { color: #fb5324; }

.pt20 { padding-top:20px; }

.w50 { width:50%; }
.w60 { width:60%; }
.w70 { width:70%; }
.w80 { width:80%; }
.w90 { width:90%; }
.w100 { width:100%; }

.center { margin:0 auto; }

input[type="image"] { float:right; border:1px solid #fb5324 !important; }
    input[type="image"]:hover { box-shadow:0 0 3px #000; }

.contactForm { width:80%; }
    .contactForm input { width:100%; }

.g-recaptcha { margin:0 auto; width:285px; }

@media only screen and (min-width: 320px) and (max-width: 600px) {
    .scheduleDD .scheduleTitle { padding-left: 5px; }
    .scheduleDD .scheduleContent { padding-left: 5px; }

    .scheduleImg { display: none; }
    .districtMeet h3 { font-size: 20px; }

    .news .schedule p { font-size: 20px; }
}

@media only screen and (min-width: 320px) and (max-width: 900px) {
    .about { width: 90%; text-align: left; }
        .about .aboutImg { display: none; }
}


/*Gallery*/
.galleryImages #gallery { width:100%; }
#gallery table { width:100%; }
    #gallery td { text-align:center; vertical-align:top; }
    #gallery td img { width:90%; margin:0 auto; }

@media only screen and (max-width: 767px) {
    #gallery td { display:inline-block; width:50%; }
}

/*Footer Alt Nav*/
.footerAltNav { display: inline-block; float: right; width: 530px; margin-top: 60px; }
    .footerAltNav a { color: white; text-decoration: none; }
    .footerAltNav .btnFooter { float: left; clear: right; background-color: #fb5324; margin-right: 10px; width: 160px; height: 40px; padding-top: 10px; text-align: center; }

.footerLogo { text-align:center; font-size:12px; color:#fff; margin-top:5px; }

@media only screen and (min-width: 320px) and (max-width: 608px) {
    .footerAltNav { width: 100%; }
        .footerAltNav .btnFooter { width: 100%; margin-bottom: 10px; }
}

@media only screen and (min-width: 608px) {
    .footerAltNav .btnFooter { margin-bottom: 20px; }
}

.form { width: 70%; margin: 0 auto; }
/*pastqualifiers.aspx*/
.nationalQualifiers img { width: 30%; float: right; margin-right: 20px; margin-top: 20px; }

@media only screen and (max-width: 826px) {
    .nationalQualifiers img { display: none; }
    .nationalQualifiers > div { width: 100%; text-align: center; }
}









/*footer*/

.footer { background: black; min-height: 138px; float: left; width: 100%; position:relative; }
    .footer img { margin-top: 20px; margin-left: 40px; }

.footerNav ul { float: right; clear: both; display: inline-block; margin: 0; padding: 0; list-style-type: none; margin-right: 10px; }

    .footerNav ul li, .mobileFooter ul li { float: left; margin-left: 10px; margin-top: 40px; width: 82px; display: block; font-size: 15px; }
        .footerNav ul li a, .mobileFooter ul li a { color: white; }
            .footerNav ul li a:hover, .mobileFooter ul li a:hover { border-bottom: 5px solid #fb5324; text-decoration: none; }

.mobileFooter { display: none; }


.copyright { position:absolute; bottom:0; width:100%; text-align:center; }
    .copyright p { color:#fff; }


@media only screen and (min-width:768px) and (max-width: 991px) {

    .footerLogo { width: 185px; }
        .footerLogo img { width: 100%; }

    .footerNav { margin-top: -48px; }
        .footerNav ul li { font-size: 11px; margin: 0; }
}

@media only screen and (max-width: 767px) {
    .footerNav { display: none; }

    .footer { width: 100%; }
        .footer img { margin: 0; }
    .mobileFooter { display: block; height: 35px; width: 100%; padding: 0; text-align: center; }
        .mobileFooter ul { height: 100%; margin: 0; padding: 0; width: 552px; display: inline-block; margin-top: 5px; }
            .mobileFooter ul li { margin-top: 0; }

    .centerNav { margin: 0 auto; }

    .footerLogo { text-align: center; margin-top: 10px; margin-bottom: 10px; }





    .footerNav li { text-align: center; width: 16.66%; margin-left: 0; }
}




@media only screen and (max-width: 563px) {

    .mobileFooter ul { width: 100%; }
        .mobileFooter ul li { font-size: 12px; width: 16.66%; margin: 0; }

    .footerLogo img { width: 98px; margin: 10px auto 20px; height: 30px; }
}

@media only screen and (max-width: 415px) {

    .mobileFooter ul { }
        .mobileFooter ul li { font-size: 10px; }
}

@media only screen and (max-width: 353px) {
    .mobileFooter { height: 147px; }
        .mobileFooter ul li { width: 100%; margin-top: 10px; }
            .mobileFooter ul li a { width: 100%; }

    .footerLogo { margin-bottom: 0; }
    .mobileFooter ul li:hover { background: white; color: #fb5324; }
    .mobileFooter ul li a:hover { border: none; color: #fb5324; }
}
