﻿/* -------------------------------------------------- */
/* created by designesia
/* -------------------------------------------------- */

@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900,900i');

/* -------------------------------------------------- */
/* body */
/* -------------------------------------------------- */
body {
font-family: 'Roboto',Arial, Helvetica, sans-serif;
background:url(images/bg.jpg) top fixed #222;
font-size:12px;
}

h1,h2,h3,h4,h5{
color:#fff;
font-weight:bold;
text-transform:uppercase;
}


#wrapper{
padding:60px 0 0 0;
}

h2{
display:inline-block;
margin-bottom:40px;
font-size:16px;
padding:20px 40px 20px 40px;
letter-spacing:10px;
border-left:solid 1px #ca8e46;
border-right:solid 1px #ca8e46;
}

h4{
display:inline-block;
padding:5px 20px 5px 20px;
font-size:10px;
font-weight:bold;
border-left:solid 1px #ca8e46;
border-right:solid 1px #ca8e46;
letter-spacing:2px;
}

.preview{
font-weight:500;
margin-bottom:60px;
text-align:center;
}

.preview img{
width:94%;
height:auto;
margin-bottom:30px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;

-webkit-box-shadow: 5px 5px 30px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 5px 5px 30px 0px rgba(0,0,0,0.2);
box-shadow: 5px 5px 30px 0px rgba(0,0,0,0.2);

}


.preview img{
background:rgba(255,255,255,.1);
padding:6px;
}

.preview:hover img{
background:#ca8e46;
padding:12px;
-webkit-box-shadow: 5px 5px 30px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 5px 5px 30px 0px rgba(0,0,0,0.3);
box-shadow: 5px 5px 30px 0px rgba(0,0,0,0.3);

}

.label{
color:#111;
background:#FAB702;
font-weight:800;
padding:2px 2px 2px 4px;
margin-right:10px;
}
h2:before,h2:after{
content:"";
width:0px;
height:1px;
background:#efc502;
position:absolute;
margin-top:6px;
margin-left:-30px;
}
h2:after{
margin-left:10px;
}
.preview:hover h2:after,
.preview:hover h2:before{
width:20px;
}

.img-responsive{
margin:0 auto;
}

.preview h2,
.preview img,
h2:before,h2:after,
.preview h4
{
-o-transition:.5s;
-ms-transition:.5s;
-moz-transition:.5s;
-webkit-transition:.5s;
transition:.5s;
 outline: none;
}


/* divider */
/* ------------------------------ */
.spacer-single{
width:100%;
height:30px;
display:block;
clear:both;
}

.spacer-double{
width:100%;
height:60px;
display:block;
clear:both;
}