/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-width : 320px) and (max-width:568px)  {

    .site-name img {
        margin:0 auto;
        display:block;
    }
    .club-edit-top {
		text-align:center
	}
	.intro-btn {
	    padding:10px 10px;
	 }
 	.login-section {
	    padding: 10px 0px;
	}
	.logo-container {
	    width: 110px;
	    height: 110px;
	    border-radius: 110px;
	}
	.logo-overlay-title{
		width:110px;
	  	height:110px;
	    border-radius:110px;
	}
	.logo-overlay-title:hover{
		width:110px;
	  	height:110px;
	    border-radius:110px;
	}
	h5.logo-title {
	    font-size: 0.6rem;
	}
	.social {
	    width: 100%;
	    margin-bottom: 10px;
	}
	.social a {
		font-size:0.8rem;
	}
}
/* Smartphones landscape */
@media only screen and (min-width : 320px) and (max-width:568px) and (orientation : landscape)  {
	.welcome {
	    min-height: 390px;
	    max-height: 390px;
	}

}

/* Smartphones (portrait) ----------- */
@media only screen and (min-width : 320px) and (max-width:568px) and (orientation : portrait)  {
.welcome {
    min-height: 470px;
    max-height: 450px;
}
	.club-holder {
    padding: 14px 10px;
    color: #fff;
}
.club-title {
    color: #fff;
    display: block;
    vertical-align: middle;
    padding-top: 70px;
    text-align: center;
}
.club-logo-main {
    width: 200px;
    height: 200px;
    border-radius: 200px;
    background: linear-gradient(rgba(0,0,0,1), rgba(42,79,135,0.5));
    /* padding-top: 35px; */
    transform: rotateY(0deg);
    transition: ease all 1s;
    margin-left: 35px;
}
}

/* Small Tablets Both */
@media only screen and (min-width : 600px) and (max-width:800px)  {
	.club-edit-top {
		text-align:center
	}

}

/* Small Tablets (Portrait) ----------- */
@media only screen and (min-width : 600px) and (max-width : 800px) and (orientation : portrait) {
.menu > li > a {
    padding: 1rem 1.1rem;
    font-size: 0.85rem;
}
	.intro-btn {
	    padding:10px 10px;
	 }
	 .logo-container {
	    width: 90px;
	    height: 90px;
	    border-radius: 90px;
	}
	.logo-overlay-title{
		width:90px;
	  	height:90px;
	    border-radius:90px;
	}
	.logo-overlay-title:hover{
		width:90px;
	  	height:90px;
	    border-radius:90px;
	}
	h5.logo-title {
	    font-size: 0.6rem;
	}
}

/* Small Tablets (landscape) ----------- */
@media only screen and (min-width : 600px) and (max-width : 800px) and (orientation : landscape) {
	.login-section {
	    padding: 10px 0px;
	}
		.club-title {
    color: #fff;
    display: block;
    vertical-align: middle;
    padding-top: 70px;
    text-align: center;
}
.club-logo-main {
    width: 200px;
    height: 200px;
    border-radius: 200px;
    background: linear-gradient(rgba(0,0,0,1), rgba(42,79,135,0.5));
    /* padding-top: 35px; */
    transform: rotateY(0deg);
    transition: ease all 1s;
    left: 30%;
    position: relative;
}
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-width : 801px) and (max-width : 1024px) {
.menu > li > a {
    padding: 1rem 17px;
    font-size: 0.85rem;
}
	.club-edit-top {
			text-align:center
		}
	.logo-container {   
		width : 120px;
		height : 120px;	   
	    border-radius: 120px;
	}
	.logo-overlay-title{
		width:120px;
	  	height:120px;
	    border-radius:120px;
	}
	.logo-overlay-title:hover{
		width:120px;
	  	height:120px;
	    border-radius:120px;
	}
	h5.logo-title {
	    font-size: 0.8rem;
	}
	.intro-btn {
	    padding:10px 10px;
	 }

}

/* iPads (landscape) ----------- */
@media only screen and (min-width : 801px) and (max-width : 1024px) and (orientation : landscape) {
	 .gallery-feature img {
    display: block;
    max-width: 315px;
    min-height: 235px;
    width: auto;
    height: auto;
}
}
/* iPads (portrait) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) {

}

/* Larger Screens */
@media only screen and (min-width : 1025px) and (max-device-width : 1980px) {

}

/* custom styles */
@media only screen and (max-width: 640px) {


}

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

}
@media only screen and (min-width: 1020px) {
	/* not sure where this came from */
	/*.top-bar-section li:not(.has-form) a:not(.button),.top-bar-section li.active:not(.has-form) a:not(.button),.top-bar-section li.active:not(.has-form) a:not(.button):hover {
		line-height: 95px;
	}*/
}

@media screen and (min-width: 40em) {
	.top-bar, .top-bar ul {
	    text-align:center;
	}

	.menu.medium-horizontal>li {
	    display: inline-block;
	}
}