

/*#region GENERAL */

#wrapper{
    height: 100%;
}

body {
  background-color: #dddddd;
}

.mdl-layout-title a{
    color: white;
}

.mdl-layout-title a:hover{
    color: white;
    text-decoration: none;
}

.mdl-layout__drawer .mdl-layout-title a{
    color: #424242;
}


.tile-container{
    width: 20% !important;
}

/*.fotorama{
	width: 50%;
	margin:0 auto;
}*/

@media screen and (max-width: 767px){
    .tile-container{
    width: 100% !important;
}
}

.mdl-layout__container{
    max-width: 2000px !important;
}

/*#endregion */

/*#region HEADER */

/*TITLE*/
@media screen and (min-width: 1500px) {
    #title {
        font-size: 85px;
        margin-top: 6%;
    }
}

@media screen and (max-width: 1499px){
    #title{
        font-size: 85px;  
        margin-top: 7%;      
    }
}

@media screen and (max-width: 1499px){
    #title{
        font-size: 75px; 
        margin-top: 7%;       
    }
}

@media screen and (max-width: 1200px){
    #title{
        font-size: 65px;
        margin-top: 7%;
    }
}

@media screen and (max-width: 900px){
    #title{
        font-size: 55px;
        margin-top: 7%;
    }
}

@media screen and (max-width: 767px){
    #title{
        font-size: 45px;
        margin-top: 7%;
    }
}

@media screen and (max-width: 600px){
    #title{
        font-size: 40px;
        margin-top: 7%;
    }
}

/*BANNER BACKDROP CONTAINER*/

#event-summary-container {    
    font-size: 2.5em;
    background-color: #424242;
    text-align: center;
    color: #fff;
    height: auto;
}


@media screen and (min-width: 1500px) {
    #event-summary-container {
        font-size: 2.5em;
        height: auto;
        background: url(../img/golf-backdrop.jpg) no-repeat;
        background-size: cover;
    }
}

@media screen and (max-width: 1499px){
    #event-summary-container {
        font-size: 2.5em;
        height: auto;
        background: url(../img/golf-backdrop.jpg) no-repeat;
        background-size: 100%;
    }
}

@media screen and (max-width: 1200px){
    #event-summary-container {
        font-size: 2.5em;
        height: auto;
        background: url(../img/golf-backdrop.jpg) no-repeat;
        background-size: 100%;
    }
}

@media screen and (max-width: 601px){
    #event-summary-container {
        font-size: 2.5em;
        height: 875px;
        background: url(../img/golf-backdrop.jpg) no-repeat;    
        background-size: cover;
    }
}


/*BANNER BACKDROP SHADING OVERLAY*/
#event-summary-details-container{
    height: inherit;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    padding-bottom: 2%;
}

/*BANNER CARD ROW CONTAINER*/
.summary-row{
    width: 100%;
}

@media screen and (min-width: 768px) and (max-width: 1499){
    .summary-row{
        margin-left: 100px;
        width: 100%;
    }
}

@media screen and (min-width: 600px) and (max-width: 767){
    .summary-row{
        margin-left: 100px;
        width: 100%;
    }
}

/*BANNER CARD IMAGES*/
.mdl-card__title img{
    margin-left: 7%;
    height: auto;
    width: 90%;
    max-height: 350px;
}


/*EVENT summary HEADER*/
#event-summary-icon{
    background: url(../img/golf-club.png) no-repeat;
    background-size: cover;
    width: 83px;
    height: 83px;
    display: inline-block;
    vertical-align:middle;
}

@media screen and (max-width: 1400px) {

    #event-summary-icon{
        background: url(../img/golf-club.png) no-repeat;
        background-size: cover;
        width: 75px;
        height: 75px;
        display: inline-block;
        vertical-align:middle;
    }

}

.event-description-row{
    margin-top: 80px;
    margin-left: 2%;
}

#summary-title h3{
}

#summary-title{
    margin-top: -3%;
}

#event-summary-title{
    display: inline-block;
    font-size: 55px;
    margin-left: 2%;
    vertical-align:middle;
}

@media screen and (max-width: 1400px) {

        #event-summary-title{
        display: inline-block;
        font-size: 40px;
        margin-left: 2%;
        vertical-align:middle;
    }

}


.mdl-shadow--2dp{
    margin-top: 7%;
    margin-left: 10px;
}


/*EVENT DETAILS DATE*/


#event-description-container{
    background:rgb(66, 66, 66); 
    width: 100%;   
    height: auto;
    color: white;
    padding-bottom: 3%;
}

#event-description-container p{
    color: white;
    line-height: 35px;
    margin-top: 5%;
    font-size: 20px;
}

@media screen and (max-width: 1400px){
        #event-description-container p{
        color: white;
        line-height: 30px;
        margin-top: 5%;
        font-size: 16px;
    }
}

#date-container{
    margin-top: 2%;
}

#date{
    margin-top: 5%;
}

#time{
    margin-top: 5%;
}


#time .material-icons{
    font-size: 50px;
}

@media screen and (max-width: 1400px) {

        #time .material-icons{
        font-size: 40px;
    }
}

#date .material-icons{
    font-size: 50px;
}

@media screen and (max-width: 1400px) {

        #date .material-icons{
        font-size: 40px;
    }
}

#date h4{
    display: inline;
    vertical-align: middle;
}

@media screen and (max-width: 1400px) {
        #date h4{
        font-size: 18px;
    }
}

#date i{
    display: inline;
    vertical-align: middle;
}

#time h4{
    display: inline;
    vertical-align: middle;
}

@media screen and (max-width: 1400px) {
        #time h4{
        font-size: 18px;
    }
}

#time i{
    display: inline;
    vertical-align: middle;
}

#time a{
    text-decoration: none;
    color: white;
}

/*EVENT DETAILS CARDS*/

.mdl-card__supporting-text{
    margin-left: auto;
    margin-right: auto;
}

.demo-card-wide > .mdl-card__title{
    background-color: rgb(71, 0, 122) !important;
}

.demo-card-wide2 > .mdl-card__title{
    background-color: rgb(255, 255, 255) !important;
}


#header-next-section-icon{
    margin-top: 105px;
    text-decoration: none;
    color: #fff;
}

#header-next-section-icon span{
    margin-top: 1%;
}

@media screen and (max-width: 700px) {
        #header-next-section-icon span{
    margin-top: 23%;
}
}


.mdl-layout__header{
    background-color: rgb(71, 0, 122) !important;
}

/*#endregion */

/*#region EVENT DETAILS*/

.demo-card-wide.mdl-card {
  margin-top: 20%;
  width: 95%;
  max-width: 550px;
}

.demo-card-wide2.mdl-card {
  margin-top: 20%;
  width: 95%;
  max-width: 550px;
}

@media screen and (min-width: 768px) and (max-width: 1499){
    .demo-card-wide mdl-card mdl-shadow--2dp {
      height: 300px !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1499){
    .demo-card-wide2 mdl-card mdl-shadow--2dp {
      height: 300px !important;
    }
}
.demo-card-wide > .mdl-card__menu {
  color: #fff;
}

.demo-card-wide2 > .mdl-card__menu {
  color: #fff;
}

/*EVENT CARDS*/
.demo-card-square.mdl-card {
  width: 90%;
  height: 320px;
  color: #444444
}

.demo-card-square > .mdl-card__title {
  color: #fff;
  height: 215px;
}

.demo-card-square > .mdl-card__title.player-icon {
  background:
    url('/img/user-group.png') 50% 40% no-repeat rgb(71, 0, 122);
  background-size: 35% 55%;
}

.demo-card-square > .mdl-card__title.course-icon {
  background: url('/img/golf-course.png') 50% 40% no-repeat rgb(71, 0, 122);
    background-size: 35% 55%;
}

.demo-card-square > .mdl-card__title.gift-icon {
  background:
    url('/img/gift-wrapped.png') 50% 40% no-repeat rgb(71, 0, 122);
  background-size: 35% 55%;
}

.demo-card-square > .mdl-card__title.sponsor-icon {
  background:
    url('/img/sponsor.png') 50% 40% no-repeat rgb(71, 0, 122);
  background-size: 35% 55%;
}

.demo-card-square > .mdl-card__title.gallery-icon {
  background:
    url('/img/gallery.png') 50% 40% no-repeat rgb(71, 0, 122);
  background-size: 35% 55%;
}

.date-icon{
    margin-top: 5px;
}


#event-details-container {
  width: 100%;
  height: auto;
  padding-bottom: 4%;
}

#golf-detail {
  width: 90%;
  margin-top: 3%;
  margin-left: auto;
  margin-right: auto;
}

#event-details-container p {
  margin: 30px 10px 0 10px;
  color: #fff;
  font-size: 1.3em;
}

.participant-icon{
    margin-left: 25%;
}


.demo-card-square > .mdl-card__title {
    height: 215px;
}

.date-icon{
    margin-top: 5px;
}


#golf-detail {
    width: 90%;
    margin-left: auto;
    margin-right: auto;   
}

#golf-detail .demo-card-square mdl-card mdl-shadow--2dp{
    height: 200px !important;
}

.participant-icon{
    margin-left: 25%;
}

/*#endregion EVENT DETAILS*/

/*#region CONTACT FORM */

#contact {
  height: 500px;
  background-color: #333;
  color: #ccc;
}
#contact h2 {
  margin-top: -10px;
}
#contact-form {
  margin-top: 20px;
}

#contact {
    height: 500px;
}
#contact h2 {
    margin-top: -10px;
}
#contact-form {
    margin-top: 20px;
}

/*#endregion */

/*#region PLAYER PAGE */

#div-player-header{

}

#div-player-header h3{
    display: inline;
    vertical-align: middle;
}

#div-player-header img{
    display: inline;
    vertical-align: middle;
}

#div-player-header{

}

#div-player-details{
    color: #757575 !important;    
}

#div-player-header h3{
    display: inline;
    vertical-align: middle;
}

#div-player-header img{
    display: inline;
    vertical-align: middle;
}

#map{
    width: 300px;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
}

#div-map-container{
    margin-top: 20px;
    color: #757575 !important;   
}

#btnSignUp{
    margin-top: 15px;
    margin-left:auto;
    margin-right:auto;
    height: 55px !important;
    width: 150px !important;
    font-size: 18px !important;
}

/*#endregion */

/*#region Sponsor Page */



#header-icon-sponsor{
    width: 10%;
    height: auto;
    margin-left: 2%;
    margin-right: 2%;
}

.demo-list-three {
  width: 650px;
}

.sponsor-list-container{
    width: 95% !important;
}

.sponsor-list{
    min-width: 400px !important;
}

.sponsor-image{
    width: 15%;
    height: auto;
    float: left;
    margin-right: 2%;
}

.dogwood-icon{
    width: 9%;
}

.wellness-icon{
    width: 10%;
}

.tyson-icon{
    width: 12%;
}

.state-steel-logo{
    width: 20%;
}

.welding-icon{
    width: 10%;
}

#btnSponsor{
    margin-left: 14%;
    margin-top: -4%;
}
@media screen and (max-width: 700px) {

    #btnSponsor{
    margin-left: 14%;
    margin-top: 5% !important;
    }

}



.greenburg{
    width: 19%;
}

.gerkin{
    width: 12%;
}

/*Modal*/
.sponsorship-option-container{
    margin-left: -50px;
}

#slt_sponsor{
    width: 300px;
}

#sponsor_message{
    width: 95%;
    height: 80px;
}

.list-item{
    margin-top: 2%;
    height: 15px !important;
}

.div-form{
    margin-top: -7%;
}

#btnSignUp a{
    color: white;
}

/*#endregion */

#SignUpLabel{
    margin-top: 8%;
}