/* font Awesome http://fontawesome.io*/
/* Animation.css*/
@import url(https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css);

.col-item {
    background: #FFF;
    margin-bottom:12px;
}
.col-item .options {
    position:absolute;
    top:6px;
    right:22px;
}
.col-item .photo {
    overflow: hidden;
}
.col-item .photo .options {
    display:none;
}
.col-item .photo img {
    margin: 0 auto;
    width: 100%;
}

.col-item .options-cart {
    position:absolute;
    left:22px;
    top:6px;
    display:none;
}
.col-item .photo:hover .options,
.col-item .photo:hover .options-cart {
    display:block;
    -webkit-animation: fadeIn .5s ease;
    -moz-animation: fadeIn .5s ease;
    -ms-animation: fadeIn .5s ease;
    -o-animation: fadeIn .5s ease;
    animation: fadeIn .5s ease;
}
.col-item .options-cart-round {
    position:absolute;
    left:42%;
    top:22%;
    display:none;
}
.col-item .options-cart-round button {
    border-radius: 50%;
    padding:14px 16px;

}
.col-item .options-cart-round button .fa {
    font-size:22px;
}
.col-item .photo:hover .options-cart-round {
    display:block;
    -webkit-animation: fadeInDown .4s ease;
    -moz-animation: fadeInDown .4s ease;
    -ms-animation: fadeInDown .4s ease;
    -o-animation: fadeInDown .4s ease;
    animation: fadeInDown .4s ease;
    opacity:0.8;
    position:absolute;
    top:15%;
}


.col-item .options-video-round{
    position:absolute;
    left:42%;
    top:25%;
    display:inline-block;
    opacity:0.5;
}
.col-item .options-video-fixed
{
    position:absolute;
    left:42%;
    top:25%;
    display:none;
}
.col-item .options-video-round button{
    border-radius: 50%;
    padding:14px 16px;

}
.col-item .options-video-round button .fa, .col-item .options-video-fixed button .fa {
    font-size:22px;
}
.col-item .photo:hover .options-video-round, .item-hovered .photo .options-video-round{
    -webkit-animation: opacity .400s ease-out;
    -moz-animation: opacity .400s ease-out;
    -ms-animation: opacity .400s ease-out;
    -o-animation: opacity .400s ease-out;
    animation: opacity .400s ease-out;
    opacity:0.8;
}

.option-video-round-selected
{
    -webkit-animation: opacity .400s ease-out;
    -moz-animation: opacity .400s ease-out;
    -ms-animation: opacity .400s ease-out;
    -o-animation: opacity .400s ease-out;
    animation: opacity .400s ease-out;
    opacity:0.8;
}

.item-video:hover .info .link-text {
    text-decoration:underline!important;
}

.col-item .photo:hover .options-video-round button, .item-hovered .photo .options-video-round button{
    -webkit-animation: color .400s ease-out;
    -moz-animation: color .400s ease-out;
    -ms-animation: color .400s ease-out;
    -o-animation: color .400s ease-out;
    animation: color .400s ease-out;
    color:red;
}


.col-item .info {
    padding: 10px;
    margin-top: 1px;
}
.col-item .price-details {
    width: 100%;
    margin-top: 5px;
}
.col-item .price-details h1 {
    font-size: 14px;
    line-height: 20px;
    margin: 0;
    float:left;
}
.col-item .price-details .details {
    font-size:12px;
    clear:both;
    margin-top:10px;
}
.col-item .price-details span {
    float:right;
}
.col-item .price-details .price-new {
    font-size:16px;
}
.col-item .price-details .price-old {
    font-size:18px;
    text-decoration:line-through;
}
.col-item .separator {
    border-top: 1px solid #E1E1E1;
}

.col-item .clear-left {
    clear: left;
}
.col-item .separator a {
    text-decoration:none;
}
.col-item .separator p {
    margin-bottom: 0;
    margin-top: 6px;
    text-align: center;
}

.col-item .separator p i {
    margin-right: 5px;
}
.col-item .btn-add {
    width: 60%;
    float: left;
}
.col-item .btn-add a {
    display:inline-block !important;
}
.col-item .btn-add {
    border-right: 1px solid #E1E1E1;
}
.col-item .btn-details {
    width: 40%;
    float: left;
    padding-left: 10px;
}
.col-item .btn-details a {
    display:inline-block !important;
}
.col-item .btn-details a:first-child {
    margin-right:12px;
}
.date
{
    color:gray;
}
.detail
{
    font-size:14px;
    margin-top:5px;
}

.animation-item img:hover, .item-hovered .animation-item img {
    opacity: .4;
    transition: opacity .4s ease-out;
    -moz-transition: opacity .4s ease-out;
    -webkit-transition: opacity .4s ease-out;
    -o-transition: opacity .4s ease-out;
}
.link-text
{
    text-decoration:none;
    cursor:hand;
    color:black;
}
.link-text:hover
{
    text-decoration:none;
    cursor:hand;
    color:black;
}
.more-info:hover
{
    text-decoration:underline;
}