@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400);


body{
  font-family: 'Source Sans Pro', sans-serif;
}
section{
  text-align:center;
}
.footer #button{
	width:15%;
	height:200%;
	border: #3d3131 12px solid;
	border-radius:35px;
	margin:0 auto;
  position:relative;
  text-align: center;
  font-size: 45px;
  color: aliceblue;
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}
.footer #button:hover{
	width:35px;
	height:35px;
	border: #3d3131 12px solid;
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
	position:relative;
}
.footer {
	bottom:0;
	left:0;
	position:fixed;
    width: 100%;
    height: 3.5em;
    overflow:hidden;
    margin:0 auto;
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
	z-index:999;
}
.footer:hover {
	-webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
	height: 17em;
}

/* to change footer height for mobile phone */
@media only screen and (max-width: 600px) {
  .footer:hover {height: auto;}
}

@media only screen and (min-width: 600px) {
  .footer:hover {height: auto;}
}


@media only screen and (min-width: 768px) {
  .footer:hover {height: auto;}
}


.footer #container{
	margin-top:5px;
	width:100%;
  height:100%;
  position:relative;
  top:0;
  left:0;
	background: #3d3131;
  padding: 30px;
}

@media only screen and (max-width: 600px) {
  .footer #container {padding: 20px 10px 20px 10px;}
}

@media only screen and (min-width: 600px) {
  .footer #container {padding: 20px 10px 20px 10px;}
}


@media only screen and (min-width: 768px) {
  .footer #container {padding: 20px 10px 20px 10px;}
}

.footer #cont{
  position:relative;
  top:-45px;
  right:190px;
	width:150px;
	height:auto;
	margin:0 auto;
}
.footer_center{
	width:500px;
	float:left;
  text-align:center;
}
.footer h3{
	font-family: 'Helvetica';
	font-size: 30px;
	font-weight: 100;
}

/* for icon colors */
a.icon {
  color: #3b5998;
}
a.icon2 {
  color: #e4717a
}

a:link {
  text-decoration: none;
}

a.faq-link {
  color: #c6c6c6;
}
/* for Subscribe button */

.btn_get_two {
    -webkit-box-shadow: none;
    box-shadow: none;
    background: #5e2ced;
    border-color: #5e2ced;
    color: #fff;
}

.btn_get_two:hover {
    background: transparent;
    color: #c6c6c6;
    border-color: green;
    border-style: ridge;
}

/* to float subscribe button */
.floated {
  float: right;
}

#close {
    display:inline-block;
    padding:2px 5px;
    background:#ccc;
}

#close:hover {
    display:inline-block;
    padding:2px 5px;
    background:#ccc;
    color:#fff;
}
