﻿.floatleft {
    float:left;
}
.floatright {
    float:right;
}
img {
    /*max-width:100%;*/
}
.rotate {
    position:relative;
    text-align:center;
    transition: transform 0.5s ease 0s;
    /*height:auto;*/
    /*height:150px;*/
}
@media (max-width:992px) {
    div.rotate {
        font-size:0.8em;
    }
}
@media (max-width:768px) {
    div.rotate {
        font-size:0.7em;
    }
}
.rotate .img {
    transition: transform 0.5s ease 0.5s;
    transition-delay: 1.5s;
    -webkit-transition: transform 0.5s ease 0.5s;
    -moz-transition:transform 0.5s ease 0s;
    top:0px;
    bottom:0px;
    margin:auto;
    /*height:150px;
    width:100%;*/
}
.rotate .img img {
    height:100% !important;
    width:auto !important;
}
.rotate .text {
    position:absolute;
    transition: transform 0.5s ease 0s;
    transform:scaleX(0.0);
    margin:auto;
    top:0px;
    width:100%;
    height:100%;
    text-align:center;
    -webkit-transform:scaleX(0.0);
    -webkit-transition:transform 0.5s ease 0s;
    -moz-transform:scaleX(0.0);
    -moz-transition:transform 0.5s ease 0s;
    overflow:hidden;
}
.rotate:hover .text {
    transform:scaleX(1.0);
    transition-delay: 0.5s;
    -webkit-transform:scaleX(1.0);
    -moz-transform:scaleX(1.0);
    /*position:relative;*/
}
.rotate .img{
    transition-delay: 0.5s;
}
.rotate:hover .img{
    transform:scaleX(0);
    transition-delay: 0s;
    -webkit-transform:scaleX(0.0);
    -moz-transform:scaleX(0.0);
    /*height:0px ;*/
    /*transition: height 1s;*/
}
.hue-rotate {
    filter:hue-rotate(90deg);
    -webkit-filter:hue-rotate(90deg);
    -moz-filter:hue-rotate(90deg);
}
.invert {
    filter: invert(90%);
    -webkit-filter: invert(90%);
    -moz-filter: invert(90%);
}
img.Zoom {
    cursor:pointer;
}
#DivImgBig {
    position:absolute;
    padding:10px;
    display:none;
    width:auto;
    max-width:100%;
    background: rgba(246, 246, 246, 0.9) none repeat scroll 0% 0%;
    color:#000;
    background-image: url(/cms/iwebs/images/loading.gif);
    background-repeat:no-repeat;
    background-position:center;
    transition-delay: 1s;
    transition: all 0.5s linear 0.1s;
    z-index: 10000;
}
#DivImgBig img {
    max-width:100%;
    clear:both;
    cursor:pointer;
}
    #DivImgBig #Subtext, #DivImgBig #Exit {
        float:left;
        padding:10px 5px 0px 5px;
    }
    #DivImgBig #Subtext {
        width:95%;
    }
    #DivImgBig #Exit {
        width:5%;
        text-align:right;
        cursor:pointer;
    }
.HoverHighlight:hover {
    animation: HoverHighlight;
    animation-duration: 1s;
    animation-iteration-count: 1;
}
@keyframes HoverHighlight {
    0% { opacity:1; }
    50% { opacity:0.5; background-color:white;}
    100% {opacity:1;}
}
.HoverPulse:hover {
    animation: Pulse;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}
@keyframes Pulse {
    0% {transform: scale(1);}
    50% {transform: scale(1.1);}
    1000% {transform: scale(1);}
}
@keyframes PulseText {
    0% {transform: scale(1);}
    50% {transform: scale(1.05);}
    1000% {transform: scale(1);}
}

.HoverOpacity:hover {
    animation: opacitychange;
    animation-duration: 1s;
    animation-iteration-count: 1;
}
@keyframes opacitychange {
    0% { opacity:1;}
    25% {opacity:0.6;}
    50% {opacity:0.2; color:transparent;}
    750% {opacity:0.6;}
    100% {opacity:1;}
}
.HoverSpin360, .HoverSpin180 {
    max-width: 100%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
}
.HoverSpin360:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    transform: rotate(360deg);
}
.HoverSpin180:hover {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    transform: rotate(180deg);
}
