

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

body{ background:url(../images/bg.jpg) no-repeat fixed; text-align:center; padding:3%;     background-size: 100%; font-family: 'Droid Sans', sans-serif;}
*{ margin:0px; padding:0px;}

.logo{}
.logo img{;}

.thumbnail{ width:17%; display:inline-block;     margin:48px 1% 0 1%;    position: relative;}
.thumbnail img{ width:100%;}
.thumbnail span{ background: url(../images/arrow.png) no-repeat right 6px; text-align: left; float: left; width: 100%; margin:20px 0 0 0; text-transform:uppercase; font-size:16px; font-weight:bold; color:#333;}
.thumbnail:hover span{ color:#07AAA5;}
p.new {
    position: absolute;
    color: #fff;
    z-index: 5;
    border-radius: 100%;
    right: 0;
    background: #07AAA5;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-transform: uppercase;
    font-size: 12px;
    margin: -22px -22px 0 0;
}

.image{
  position: relative;
  overflow: hidden;
  width: 100%;  
}
.image img{
  width: 100%;
  -webkit-transition: all 300ms linear;
  transition: all 300ms linear;
 -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: scale3d(0);
}
.image img:hover {
  opacity: 0.8;
  -webkit-transform: scale3d(1.25,1.25,1);
   transform: scale3d(1.25,1.25,1);
}






 @media screen and (max-width: 1400px) {
	 .thumbnail { width: 20%;}
	 .image { height: 100%; width: 100%;}
	body{     background-size: 500%;}
    .thumbnail span {margin: 10px 0 0 0; font-size: 12px; font-weight:bold}
	p.new {width: 35px;height: 35px;line-height: 35px;font-size: 11px;margin: -22px 7px 0 0;
 }


@media screen and (max-width: 768px) {
 .thumbnail { width: 30%;}
  .logo img { width: 146px;}
  .thumbnail span {margin: 10px 0 0 0; font-size: 15px; font-weight:bold}
  p.new {width: 35px;height: 35px;line-height: 35px;font-size: 11px;margin: -22px 7px 0 0;
 }



 @media screen and (max-width: 640px) {
 .thumbnail { width: 46%;}
 .logo img { width: 146px;}
  p.new {width: 35px;height: 35px;line-height: 35px;font-size: 11px;margin: -22px 7px 0 0;
}
  
 }

 @media screen and (max-width: 480px) {
	 .thumbnail { width:80%; margin: 22px 1% 0 1%;}
	 .thumbnail span {margin: 10px 0 0 0; font-size: 18px;}
	 p.new{ margin:-16px 6px 0 0;}
 }




















