@import url('https://fonts.googleapis.com/css?family=Oswald');

body
{
font-family: 'Oswald', sans-serif;
}

.header
{
background-image:url(../images/header.jpg);
background-repeat:repeat-x;
}

.social
{
border:0px solid #FFFFFF;
border-radius:10px;
margin-left:2px;
}
.about
{
background-color:#FFFFFF;
color:#333333;
}
.readmore
{
color:#FFFFFF;
background-color:#333333;
padding:10px;
text-decoration:none;
}
.readmore:hover
{
color:#FFFFFF;
background-color:#000000;
padding:10px;
text-decoration:none;
}
.footer
{
color:#FFFFFF;
background-color:#333333;
}
.footer a
{
	padding:5px;
	border-bottom:0px solid #666666;
	display:block;
	color:#FFFFFF;
}
.copyright
{
background-color:#CCCCCC;
color:#000000;
padding:6px;
text-align:center;
}



.btn1,.btn2{
  color: #3498db;
}
.btn3,.btn4{
  color: #fff;
}
.btn1:hover,.btn2:hover{
  color: #fff;
}
.btn3:hover,.btn4:hover{
  color: #3498db;
}
.btn::before{
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 0%;
  background: #3498db;
  z-index: -1;
  transition: 0.8s;
}
.btn1::before,.btn3::before{
  top: 0;
  border-radius: 0 0 50% 50%;
}
.btn2::before,.btn4::before{
  bottom: 0;
  border-radius: 50% 50% 0 0;
}
.btn3::before,.btn4::before{
  height: 180%;
}
.btn1:hover::before,.btn2:hover::before{
  height: 180%;
}
.btn3:hover::before,.btn4:hover::before{
  height: 0%;
}