*{	-webkit-transition: .7s ease-out;
 	-moz-transition: .7s ease-out;
 	-o-transition:  .7s ease-out;
 	transition: .7s ease-out;
    list-style: none;
}

/*================================
TYPOGRAPHY
================================*/
body {
   	font-family: 'Quicksand', sans-serif;
    line-height: 1.8em;
	background-color:#fff;
	overflow:hidden;
}


.bigicon {font-size: 3em;}
.bigicon icon-bubbles {color: #c8a1bd;}

h2{font-size: 42px;}
h3{font-size: 28px;}
h4{font-size: 18px; line-height: 1.4em;}

p{
    letter-spacing: 0,5px;
    color: #535353;
	font-size:16px; 
}



blockquote
{
  font-size: 18px;
  color: #c8a1bd;
  line-height: 1.8em;
  font-family: "Playwrite HU", cursive;
  padding-left: 34px;
  border-left: none;
  background:url('../img/blockquote.png');
  margin-left:-20px;
  background-repeat:no-repeat;
  
}


/*================================
DEFAULT STYLE & FORMATING
================================*/
ul{padding: 0;}
a{color: #c8a1bd;}
a:hover{color: #383b49; text-decoration: none;}

#services{text-align: center;}
.col-md-4, .col-md-6{padding-bottom: 50px;}
.col-md-3 {padding: 0;}

.sectionhead{
    text-align: center;
    padding-top: 100px;
    padding-bottom: 50px;
}


.btn-default{
    background: none;
    border: none;
    text-transform: uppercase;
    margin: 50px 0;
    color: #c3c3c3;
    letter-spacing: 2px;
}

.btn-default:hover{
    background: none;
    color: #ea9312;
}

.btnicon, .brandicon{
    margin-right: 10px;
}


/*================================
HERO AREA
================================*/
#hero{
    color: #c8a1bd;
    text-align: center;
    background: url(../img/wall.png)no-repeat;  /*your background image*/
	width: 100%;
	height:100%
    overflow: hidden;
}

.herocontent{
    padding-top: 100px;
    width: 100%;
    max-width:940px;
}
.heroshot{
    margin-top: -5px;
    width: 100%;
}


/*================================
ABOUT SECTION
================================*/
#about{padding-top: 100px;}

.myapps{margin-top: 25px;}
.myapps li{display: inline}
.myapps li img{
    width: 30px;
}

/*================================
PORTFOLIO SECTION
================================*/
#portfolio{
    /*background: #efefef;*
	margin-top: 50px;
    padding: 30px 0;
    text-align: center;*/
	background: #c8a1bd url("../img/bg-corner5.png") no-repeat scroll 50% 0;
	border-radius: 0 0 60px ;
    overflow: hidden;
    padding: 54px 0 27px;
    position: relative;
    width: 100%;
}

#shotsByPlayerId li{
    width: 31%;
    float: left;
    padding: 15px;
    margin: 10px;
    background: #fff;
    border-radius: 5px;
}

#shotsByPlayerId li:hover{
    box-shadow: 1px 2px 25px rgba(160, 160, 160, 0.4);
    -webkit-transition: .7s ease-out;
 	-moz-transition: .7s ease-out;
 	-o-transition:  .7s ease-out;
 	transition: .7s ease-out;
}

#shotsByPlayerId li img{
    width: 100%;
    border-radius: 5px;
}

#shotsByPlayerId img:hover{
    opacity: .5;
    overflow: hidden;
}

#shotsByPlayerId a:hover{color: #ea9312;}

#shotsByPlayerId h3{
    text-align: left;
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: normal;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;}

#shotsByPlayerId h3 a{color: #363942;}

.likecount a{float: left; color: #c3c3c3;}
.commentcount a{float: right; color: #c3c3c3;}



/*================================
CONTACT SECTION
================================*/

#contact {
    background: #ffffff url("../img/bg-corner6.png") no-repeat scroll 50% 0;
    overflow: hidden;
    position: relative;
    width: 100%;
	clear:both;
}

#form-main{
	width:100%;
	float:left;
	padding-top:0px;
}


.feedback-input {
	color:#95dbaf;
	font-family: Helvetica, Arial, sans-serif;
  font-weight:500;
	font-size: 18px;
	border-radius: 0;
	line-height: 22px;
	background-color: #fbfbfb;
	padding: 13px 13px 13px 54px;
	margin-bottom: 10px;
	width:100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
  border: 3px solid rgba(0,0,0,0);
}

.feedback-input:focus{
	background: #fff;
	box-shadow: 0;
	border: 3px solid #ff5883;
	color: #ff5883;
	outline: none;
  padding: 13px 13px 13px 54px;
}

.focused{
	color:#ff5883;
	border:#ff5883 solid 3px;
}

/* Icons ---------------------------------- */
#name{
	background-image: url(../img/male80.png);
	background-size: 30px 30px;
	background-position: 11px 8px;
	background-repeat: no-repeat;
}

#name:focus{
	background-image: url(../img/male80.png);
	background-size: 30px 30px;
	background-position: 8px 5px;
  background-position: 11px 8px;
	background-repeat: no-repeat;
}

#prenom{
	background-image: url(../img/social-network14.png);
	background-size: 30px 30px;
	background-position: 11px 8px;
	background-repeat: no-repeat;
}

#prenom:focus{
	background-image: url(../img/social-network14.png);
	background-size: 30px 30px;
	background-position: 8px 5px;
  background-position: 11px 8px;
	background-repeat: no-repeat;
}

#email{
	background-image: url(../img/send4.png);
	background-size: 30px 30px;
	background-position: 11px 8px;
	background-repeat: no-repeat;
}

#email:focus{
	background-image: url(../img/send4.png);
	background-size: 30px 30px;
  background-position: 11px 8px;
	background-repeat: no-repeat;
}

#comment{
	background-image: url(../img/chat81.png);
	background-size: 30px 30px;
	background-position: 11px 8px;
	background-repeat: no-repeat;
}

textarea {
    width: 100%;
    height: 150px;
    line-height: 150%;
    resize:vertical;
}

input:hover, textarea:hover,
input:focus, textarea:focus {
	background-color:white;
}

#button-blue{
	font-family: 'Montserrat', Arial, Helvetica, sans-serif;
	float:left;
	width: 100%;
	border: #ff5883 solid 4px;
	cursor:pointer;
	background-color: #ff5883;
	color:white;
	font-size:24px;
	padding-top:22px;
	padding-bottom:22px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
  margin-top:-4px;
  font-weight:700;
}

#button-blue:hover{
	background-color: rgba(0,0,0,0);
	color: #ff5883;
}
	
.submit:hover {
	color: #95dbaf;
}
	
.ease {
	width: 0px;
	height: 74px;
	background-color: #ff5883;
	-webkit-transition: .3s ease;
	-moz-transition: .3s ease;
	-o-transition: .3s ease;
	-ms-transition: .3s ease;
	transition: .3s ease;
}

.submit:hover .ease{
  width:100%;
  background-color:white;
}

@media only screen and (max-width: 580px) {
	#form-div{
		left: 3%;
		margin-right: 3%;
		width: 88%;
		margin-left: 0;
		padding-left: 3%;
		padding-right: 3%;
	}
}

/*================================
FOOTER SECTION
================================*/

footer{
    text-align: center;
    padding: 50px 0;
    background: #080808;
	color: #c8a1bd;
}

footer p, footer .bigicon {color: #c8a1bd;}

.footerlinks{margin: 30px 0;}
.footerlinks li{
    display: inline;
    padding: 10px;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.footersocial {margin-top: 30px;}

.footersocial li{
    display:inline;
    padding: 0 15px;
    font-size: 2em;
}

.footersocial li a {color: #c8a1bd;}
.footersocial li a:hover {color: #fff;}

/*================================
FOLLOW BUTTON
================================*/
.dribbble-follow-button {
	display: inline-block;
    margin-top: 15px;
}

.dribbble-follow-button .label, .dribbble-follow-button .count {
    font: bold 11px/18px 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: #333;
    border: 1px solid #ccc;
    text-decoration: none;
    display: inline-block;
    position: relative;
    border-radius: 3px;
}

.dribbble-follow-button .label {
    padding: 0 3px 0 1px;
    white-space: nowrap;
    background: #e3e3e3;
    background: linear-gradient(top, white, #dedede);
}

.dribbble-follow-button .label i {
    height: 18px;
    width: 18px;
    float: left;
    background: url(../img/icon.png) no-repeat top left;
}

.dribbble-follow-button .label:hover {
    border-color: #bbb;
    background: #fff;
    color: #333;
}

.dribbble-follow-button .label:active {            
     box-shadow: 0 1px 5px rgba(0,0,0,.15) inset;
}

.dribbble-follow-button .count {
    margin-left: 5px;
    padding: 0 3px;
    color: #333;
    border-color: #bbb;
    font-weight: normal;
    background: white;
}

.dribbble-follow-button .count:hover {
    text-decoration: underline;
}

.dribbble-follow-button .count > * {
	top: 50%;
	left: 0;
	margin: -4px 0 0 -4px;
	border: 4px solid transparent;
	border-right-color: #aaa;
	border-left: 0;
	position: absolute;
}

.dribbble-follow-button .count u {
    margin-left: -3px;
    border-right-color: white;
}