/* ----------------------------------------- */ /* Content Template: Loop item in Previous Events - start */ /* ----------------------------------------- */ .front, .back { backface-visibility: hidden !important; -webkit-backface-visibility:hidden !important; -moz-backface-visibility:hidden; -webkit-backface-visibility:hidden; backface-visibility:hidden; } .modal-dialog { margin-top: 150px; } .modal-backdrop.in { opacity: 0.8; filter: alpha(opacity=80); } .flip-container { perspective: 1000px; display: inline-block; } .card, .front, .back { width: 100%; height: auto; } .front-textholder { height: 100%; display: table; width: 100%; z-index: 3; } .modal-backdrop { background-color: #569fc4; } .front-text { display: table-cell; vertical-align: middle; color: #fff; text-align: center; z-index: 3; } .flip-container { display: block; max-width: 336px; margin-left: auto; margin-right: auto; margin-top: 20px; } p.team-position { font-size: 15px; } .front-text p.team-position { padding: 0px !important; margin-bottom: 0px; } .front-text h3.team-member { font-size: 14px; color: #fff; margin-bottom: 0px; padding: 0px !IMPORTANT; } .front-text p { font-size: 13px; padding: 10px; line-height: 20px; font-weight: 700; } h3.team-member { padding-top: 20px; margin-bottom: 3px !important; } .front, .back { -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; position: relative; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; -ms-transition: 0.5s all; -o-transition: 0.5s all; transition: 0.5s all; transform-style: preserve-3d; } .card:hover .front { transform: rotateY(0deg); -webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); -o-transform: rotateY(0deg); -ms-transform: rotateY(0deg); } .card:hover .back { transform: rotateY(180deg); -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); -ms-transform: rotateY(180deg); } .front { z-index: 1; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); -ms-transform:rotateY(180deg); } .front { background: #579ec4; height: 100%; position: absolute; top: 0px; } .front-text p { font-size: 13px; padding: 10px; line-height: 16px; font-weight: 700; } .event-img { width: 100%; height: 200px; background-size: cover; background-color: #efefef; } .back { z-index: 2; transform: rotateY(0deg); -webkit-transform:rotateY(0deg); -moz-transform:rotateY(0deg); -o-transform: rotateY(0deg); -ms-transform:rotateY(0deg); } @media (min-width: 768px) { .modal-dialog { width: 80%; } } /* ----------------------------------------- */ /* Content Template: Loop item in Previous Events - end */ /* ----------------------------------------- */