﻿html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}

body {
}

.addPad {
    margin-top: 20px;
    margin-bottom: 20px;
}

.noPad {
    padding: 0;
}

#srchBtn, #srchBtn:hover, .mobile-nav-btn, #dvCloseMobNav, #dvCloseMobSubNav, .mobile-main-nav > a.has-subnav:before, .social .facebook, .social .twitter, .social .pinterest, .social .googleplus, .social .linkedin, .social .tumblr, #newbanner.on, .lessthan, #mainMediaDisp > iframe.aniPlay, .prodlstitemcntr > .separator, .heroLeftNav, .heroRightNav, .heroLeftNav:hover, .heroRightNav:hover, .slide-caption {
    background: url('../../Content/Images/mem-sprites.png') no-repeat top left;
}

/* Header */

#header.home {
    border-bottom: solid 1px #b0adab;
}

.tertiary {
    height: 10px 0;
    margin: 12px 0 0;
}

.tertiary ul, .tertiary input {
    float: right;
}

.tertiary ul {
    margin: -10px 15px 0 0;
    list-style-type: none;
    text-align: right;
}

#srchBtn, #srchBtn:hover {
    float: right;
    height: 20px;
    width: 20px;
    margin: 8px;
    background-position: -650px -71px; width: 21px; height: 21px;
    cursor: pointer;
}

    #srchBtn:hover {
        background-position: -650px 0; width: 21px; height: 21px;
    }

#SearchKeywords {
    margin-bottom: 10px;
    width: 110px;
}

.leadIn {
    margin-bottom: 20px;
    font-weight: 200;
    line-height: 1.4;
}

.navcntr {
    margin: 0 auto;
}

.sitelogo {
    margin-top: 28px;
}

.navbar {
    padding-right: 0;
}
    /* Hide F3 nav */
    .navbar > .nav-bar {
        display: none;
    }

.mobile-nav-btn {
    float: right;
    height: 32px;
    width: 32px;
    margin: 7px 10px 0 0;
    background-position: 0 -1365px; width: 32px; height: 32px;
    cursor:pointer;
}

.mobile-nav {
    position: absolute;
    height: 217px;
    width: 100%;
    overflow: hidden;
    z-index: 10;
}

    .mobile-nav.off {
        margin-top: -500px;
    }

    .mobile-nav.on {
        margin-top: 0px;
        box-shadow: 1px 2px 7px #BDBDBD;
    }

#dvCloseMobNav, #dvCloseMobSubNav {
    float: right;
    height: 32px;
    width: 32px;
    background-position: 0 -1201px; width: 32px; height: 32px;
    cursor:pointer;
    margin: 1px 7px 0 0;
}

#dvCloseMobSubNav {
    background-position: 0 -1283px; width: 32px; height: 32px;
}

.mobile-main-nav-cntr {
    width: 100%;
    background-color: #FFFFFF;
    position: absolute;
}

.mobile-main-nav, .mobile-sub-nav > a {
    height: 36px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 20px;
    padding: 9px 0 0 12px;
}

.mobile-main-nav {
    border-bottom: 1px solid #CCCCCC;
}

    .mobile-main-nav > .mobile-sub-nav {
        display: none;
    }

    .mobile-main-nav.sel {
        background-color: #f4f4f4;
        border-bottom-color: #c4c4c4;
    }

    .mobile-main-nav > a.has-subnav:before {
        background-position: 0 -1447px; width: 14px; height: 11px;
        content: "";
        display: inline-block;
        height: 11px;
        width: 14px;
    }

    .mobile-main-nav > a:not(.has-subnav) {
        padding-left: 19px;
    }


.mobile-disp-sub-nav {
    position: absolute;
    width: 100px;
    background-color: #f4f4f4;
    z-index: 11;
    border-left: 2px solid #c4c4c4;
    border-bottom: 2px solid #c4c4c4;
}

    .mobile-disp-sub-nav.off {
        right: -1000px;
    }

    .mobile-disp-sub-nav.on {
        right: 0px;
    }

    .mobile-disp-sub-nav > .mobile-sub-nav > a {
        display: block;
        font-weight: bold;
        letter-spacing: 1px;
        line-height: 20px;
        font-size: 0.9rem;
        margin-right: 45px;
    }

/* Non Start/Home Pages */

.secbarleft, .secbarright {
    position: absolute;
    height: 100px;
    width: 50%;
}

.secbarleft {
    left: 0;
}

.secbarright {
    right: 0;
}

.bannerimg {
    position: absolute;
    z-index: 0;
}

.bannerGrey {
    background-color: #ebeced;
}

.bannerBlue {
    background-color: #008ed4;
}

.bannerOrange {
    background-color: #f58727;
}

.bannerRed {
    background-color: #ed244c;
}

.bannerPurple {
    background-color: #7c439a;
}

.bannerPink {
    background-color: #e62592;
}

.seconarybar {
    height: 101px;
    margin: 5px 0;
    position: relative;
    z-index: 1;
}

.titletext {
    height: 95px;
    font-family: "pragmatica-web",arial,helvetica,sans-serif;
    font-size: 1.8rem;
    color: white;
    padding: 34px 0 0 15px;
}

.bread-social {
    font-family: "pragmatica-web",arial,helvetica,sans-serif;
    margin-top: 20px;
    margin-bottom: 20px;
}

.memBreadcrumb {
    margin: 2px 0 0;
    font-size: .95rem;
    color: #A7A7A8;
}

    .memBreadcrumb > a {
        color: #A7A7A8;
    }

        .memBreadcrumb > a:hover {
            color: #8E8E8F;
        }

.social {
    padding-right: 0;
}

    .social .facebook, .social .twitter, .social .pinterest, .social .googleplus, .social .linkedin, .social .tumblr {
        height: 19px;
        width: 19px;
        margin: 5px;
        background-position: 0 -360px; width: 18px; height: 19px;
    }

        .social .twitter {
            background-position: -650px -349px; width: 18px; height: 19px;
        }

        .social .pinterest {
            background-position: 0 -1770px; width: 18px; height: 19px;
        }

        .social .googleplus {
            background-position: 0 -498px; width: 18px; height: 19px;
        }

        .social .linkedin {
            background-position: 0 -1063px; width: 18px; height: 19px;
        }

        .social .tumblr {
            background-position: -650px -211px; width: 18px; height: 19px;
        }

        .social .facebook:hover {
            background-position: 0 -291px; width: 18px; height: 19px;
        }

        .social .twitter:hover {
            background-position: -650px -280px; width: 18px; height: 19px;
        }

        .social .pinterest:hover {
            background-position: 0 -1701px; width: 18px; height: 19px;
        }

        .social .googleplus:hover {
            background-position: 0 -429px; width: 18px; height: 19px;
        }

        .social .linkedin:hover {
            background-position: 0 -994px; width: 18px; height: 19px;
        }

        .social .tumblr:hover {
            background-position: -650px -142px; width: 18px; height: 19px;
        }

/* IMN Main */

p {
    color: #A7A7A8;
    font-family: "pragmatica-web",arial,helvetica,sans-serif;
}

#imnMain {
}

    #imnMain > .row {
        margin-top: 15px;
        margin-bottom: 15px;
    }

.blankmain, .blankmain p {
   margin: 0 10px;
   font-size: 14px;
}

.blankmain p, h1.title {
    color: #8f8f8f;
} 

    .blankmain div.description {
        margin: 0 5px 22px;
        font-size: 15px;
    }

    .blankmain strong {
        padding: 2px 0;
    }

/* Products */

#newbanner.on {
    position: absolute;
    height: 143px;
    width: 141px;
    background-position: 0 -1508px; width: 141px; height: 143px;
}

.lessthan {
    height: 13px;
    width: 10px;
    position: absolute;
    right: 0;
    top: 31.5%;
    background-position: 0 -931px; width: 10px; height: 13px;
    z-index: 3;
}

#mainMediaDisp {
    height: 424px;
    width: 100%;
    border: 2px solid #E2E2E2;
    background-color: #F6F7F7;
    overflow: hidden;
}

    #mainMediaDisp > img, #mainMediaDisp > iframe {
        position: relative;
        float: left;
        z-index: 1;
    }

    #mainMediaDisp > img {
        margin: 0 auto;
    }

    #mainMediaDisp > iframe {
        margin: 7px 5px 3px 6px;
        min-height: 407px;
        min-width: 670px;
    }

    #mainMediaDisp > img.nxt, #mainMediaDisp > iframe.nxt {
        z-index: 2;
    }

    #mainMediaDisp > iframe.aniPlay {
        background-color: #EBEBEB;
        background-position: -650px -418px; width: 100px; height: 100px;
        /*
        background-position: 50% 50%;
        background-repeat: no-repeat;
        */
    }

.mainMdiaThmbsCntr {
}

    .mainMdiaThmbsCntr > .leftarrow, .mainMdiaThmbsCntr > .rightarrow {
        position: absolute;
        height: 166px;
        width: 25px;
        padding-top: 9%;
        z-index: 5;
        visibility: hidden;
    }

    .mainMdiaThmbsCntr > .leftarrow {
        left: 16px;
    }

    .mainMdiaThmbsCntr > .rightarrow {
        right: 0;
    }

.leftarrow > div, .rightarrow > div {
    height: 40px;
    width: 100%;
    text-align: center;
    font-size: 1.4rem;
    background-color: #ff6f20;
    color: white;
    padding-top: 35%;
    cursor: pointer;
}

.mainMdiaThmbs {
    position: relative;
    height: 166px;
    /*width: 685px;*/
    margin: 25px 0;
    overflow: hidden;
    padding: 15px 6px;
    border: 2px solid #E1E1E1;
    z-index: 1;
}

.mediaOvrflw {
    position: absolute;
    width: 1500px;
    z-index: 0;
    padding-left: 8px;
}

    .mediaOvrflw > .t-on > .thmblnk > img {
        border-color: #bdbdbd;
    }

.thumb {
    position: relative;
    background-color: #F6F7F7;
    border: 1px solid #E2E2E2;
    max-height: 132px;
}

    .thumb:hover {
        border-color: #bdbdbd;
    }

.productimg {
    padding-right: 0;
}

.product {
    background-color: #FCFCFC;
    border: 2px solid #E1E1E1;
    border-left: none;
    min-height: 424px;
    padding: 15px 25px 0;
}

    .product > h1, .proddesccntr > a {
        text-transform: capitalize;
    }

.product > h1, .product .description > p, .msrp, .highlights, .proddesccntr > a, .proddesccntr > .features  {
    font-family: "pragmatica-web",arial,helvetica,sans-serif;
}

    .product > h1 {
        font-size: 2.3rem;
        margin-bottom: 0;
    }

    .product .description > p {
        font-size: 1.6rem;
        color: #a7a7a8;
        margin-bottom: 10px;
        line-height: 25px;
    }

.block.productimageblock, .block.productvideoblock {
    display: inline;
    padding: 10px 13px;
    width: 152px;
}

.productimageblock > .prodImg {
    position: absolute;
    float: left;
    z-index: 0;
    height: 132px;
    width: 132px;
}

.productimageblock.t-on > .thmblnk {
    border-color: #BDBDBD;
}

.thmblnk > img {
    max-height: 132px;
}

.msrp {
    height: 45px;
}

.msrp .title, .msrp > div {
    color: #00a8e1;
    float: left;
    font-size: 1.4rem;
}

    .msrp .title {
        margin-right: 10px;
    }

.highlights > div, .features > div, .prodspecs > div, .ownersupport > div {
    color: #a7a7a8;
    margin-top: 8px;
}

.highlights > span, .features > span, .prodspecs > span, .relatedprodcntr > span, .ownersupport > span {
    font-size: 1.1rem;
    color: #505155;
    font-weight: bold;
}

.hline {
    height: 50px;
    border-bottom: 3px solid #E1E1E1;
    margin-bottom: 60px !important;
}

.relatedprodcntr {
}

.highlights > div {
    margin-top: 10px;
    max-height: 230px;
    overflow-x: hidden;
    overflow-y: auto;
}

.prodspecs > div {
    margin-top: 20px;
}

.relatedprod {
    float: left;
    margin-top: 20px;
    width: 142px;
    margin-right: 20px;
}

.relatedprod > .imgcntr {
    height: 142px;
    padding: 5px;
    width: 142px;
    border: 1px solid #E1E1E1;
}

    .relatedprod > .imgcntr > img {
        margin: 6px 0 0 7px;
        width: 119px;
    }

.relprodlnk {
    width: 100%;
    margin-top: 4px;
    text-align: center;
}

.prodspecs > p {
    margin-top: 20px;
}

.ownersupport {
    margin-top: 50px;
}

/* Product Listing */

.prodlstcntr {
    padding-bottom: 80px;
}

    .prodlstcntr > .row:first-child {
        margin-top: 80px;
    }

    .prodlstcntr > .row {
        margin-top: 60px;
    }

.prodlstitemcntr {
    min-height: 205px;
    overflow: hidden;
}

    .prodlstitemcntr > .imgcntr {
        float: left;
        width: 150px;
        top: 40px;
        left: 15px;
        position: relative;
        z-index: 1;
    }
    
    .prodlstitemcntr > .separator {
        position: absolute;
        top: 23px;
        left: 137px;
        height: 169px;
        width: 17px;
        background-position: 0 -1839px; width: 17px; height: 169px;
        z-index: 1;
    }

    .prodlstitemcntr > .proddesccntr {
        position: relative;
        background-color: #FFFFFF;
        margin-left: 132px;
        padding-left: 18px;
        z-index: 2;
    }

.proddesccntr > a {
    font-size: 1.5rem;
}

.proddesccntr > .features {
    margin-top: 10px;
    color: #A7A7A8;
}

.proddesccntr > .msrp {
    height: 28px;
    margin-top: 9px;
}

    .proddesccntr > .msrp .title, .proddesccntr > .msrp > div {
        font-size: 1.1rem;
    }

    .proddesccntr > .msrp .title {
        margin-right: 6px;
    }

    .proddesccntr > .msrp > div {
        color: black;
    }


.proddesccntr > .features > span, .proddesccntr > .features > p {
    font-size: 0.97rem;
}

.proddesccntr > .features > p {
    line-height: 1.3;
}


/* text coloring */
.tc-dark-blue { color: #228ad0; }
.tc-light-blue { color: #01aae0; }
.tc-greem { color: #2eb135; }
.tc-orange-red { color: #ff823e; }
.tc-redish-purp { color: #eb53ad; }
.tc-red { color: #d6083b; }
.tc-purple { color: #b365cb; }

/* Blocks */

.start-cta.row {
    margin-top: 15px;
    margin-bottom: 15px;
    padding: 20px 0;
}

.ctablock {
    text-align: center;
    padding: 50px 0;
}

    .ctablock > h3, .ctablock > p, .ctablock a, .prodcat-cta > .ctablock > h3, .prodcat-cta > .ctablock > p, .prodcat-cta > .ctablock > a {
        font-family: "pragmatica-web",arial,helvetica,sans-serif;
    }

    .ctablock > h3, .productctablock > h3 {
        font-size: 1.49rem;
        text-transform: capitalize;
        color: #00a8e1;
    }

    .ctablock > p, .productctablock > p {
        color: #a7a7a8;
        font-size: 1.10rem;
        min-height: 88px;
    }

    .ctablock > a {
        color: #ffffff;
        background-color: #00a8e1;
        font-size: 1.10rem;
    }

.prodcat-cta {
    margin-top: 45px !important;
    margin-bottom: 25px !important;
}

.prodcat-cta > .ctablock {
    border: 2px solid #E2E2E2;
    text-align: left;
    padding: 0 0 0 0.6em;
    float: left !important;
}

    .prodcat-cta > .ctablock > h3 {
        margin-top: 11px;
        margin-bottom: 1px;
        font-size: 1.4rem;
    }

    .prodcat-cta > .ctablock > img {
        float: right;
    }

    .prodcat-cta > .ctablock > a {
        position: absolute;
        bottom: 15px;
        left: 15px;
        padding: 0.7rem 1.5rem;
        margin-bottom: 0;
    }

/* Footer */

#footer {
    background-color: #f4f4f4;
    min-height: 150px;
    margin: 20px 0 0;
}

.footercntr {
    padding: 50px 0;
}

.footernav {
    padding-right: 0;
}

    .footernav > ul {
        float: right;
        list-style-type: none;
        text-align: right;
        padding: 17px 20px 0;
    }

    .footernav > ul > li {
        display: inline;
        margin: 0 10px;
    }

.footercopy {
    padding-left: 0;
}

    .footercopy > .footerlogo {
        float: left;
    }

    .footercopy > .footerlogo > img {
        padding: 20px 0 0 20px;
    }

    .footercopy > .copyright {
        font-size: 12px;
        margin: 24px 0 0 150px;
        color: #a1a1a1;
    }

/* Vert line spacer */

.footernav .vertdivider, .footercopy .vertdivider {
    height: 60px;
}

.footernav .vertdivider {
    float: right;
    border-right: solid 1px #cccccc;
}

.footercopy .vertdivider {
    float: left;
    border-left: solid 1px #cccccc;
}

/* Foundation 5 overrides */

.row {
    max-width: 75.000em;
}

.top-bar, .top-bar-section ul, .top-bar-section li:not(.has-form) a:not(.button), .top-bar-section li:not(.has-form) a:hover:not(.button) {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-radius: 3px;
}

    .top-bar-section ul li {
        text-align: center;
    }

        .top-bar-section ul li > a, .top-bar-section ul li > a:hover {
            font-family: "pragmatica-web",arial,helvetica,sans-serif;
            font-size: 0.9rem;
            letter-spacing: 0.04rem;
        }

        .top-bar-section ul li > a {
            color: #2BA6CB;
        }

            .top-bar-section ul li > a:hover, .top-bar-section ul li:hover > a, .button {
                background: rgba(0,120,201,1) !important;
                background: -moz-linear-gradient(top, rgba(0,120,201,1) 0%, rgba(0,168,225,1) 100%) !important;
                background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,120,201,1)), color-stop(100%, rgba(0,168,225,1))) !important;
                background: -webkit-linear-gradient(top, rgba(0,120,201,1) 0%, rgba(0,168,225,1) 100%) !important;
                background: -o-linear-gradient(top, rgba(0,120,201,1) 0%, rgba(0,168,225,1) 100%) !important;
                background: -ms-linear-gradient(top, rgba(0,120,201,1) 0%, rgba(0,168,225,1) 100%) !important;
                background: linear-gradient(to bottom, rgba(0,120,201,1) 0%, rgba(0,168,225,1) 100%) !important;
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0078C9', endColorstr='#00A8E1', GradientType=0 ) !important;
                color: white;
            }

.button:hover {
    background: rgba(0,113,189,1) !important;
    background: -moz-linear-gradient(top, rgba(0,113,189,1) 0%, rgba(0,158,212,1) 100%) !important;
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,113,189,1)), color-stop(100%, rgba(0,158,212,1))) !important;
    background: -webkit-linear-gradient(top, rgba(0,113,189,1) 0%, rgba(0,158,212,1) 100%) !important;
    background: -o-linear-gradient(top, rgba(0,113,189,1) 0%, rgba(0,158,212,1) 100%) !important;
    background: -ms-linear-gradient(top, rgba(0,113,189,1) 0%, rgba(0,158,212,1) 100%) !important;
    background: linear-gradient(to bottom, rgba(0,113,189,1) 0%, rgba(0,158,212,1) 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0071BD', endColorstr='#009ED4', GradientType=0 ) !important;
}

.dropdown {
    padding: 10px;
    background-color: white !important;
    border: solid 1px #cccccc;
    box-shadow: 0 0 5px #888888;
}

.top-bar-section .dropdown li a {
    color: #88898b;
}

.prntnav {
    padding: 25px !important;
    font-weight: bold !important;
    letter-spacing: 1px;
    line-height: 20px !important;
}


.subnav, .subnav:hover {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    font-size: 0.9rem !important;
    text-align: left;
}

    .subnav:hover {
        color: white !important;
        background-color: #2BA6CB !important;
    }

/* Hero swiper */

.swipe {
    overflow: hidden;
    visibility: hidden;
    position: relative;
    margin: 0 auto;
    max-height: 600px;
    max-width: 1200px;
}

.heroLeftNav, .heroRightNav, .heroLeftNav:hover, .heroRightNav:hover {
    position: absolute;
    height: 41px;
    width: 41px;
    margin: 15px;
    top: 45%;
    background-position: 0 -658px; width: 41px; height: 41px;
    z-index: 1;
    cursor:pointer;
}

.heroRightNav, .heroRightNav:hover {
    right: 0;
    background-position: 0 -840px; width: 41px; height: 41px;
}

    .heroLeftNav:hover {
        background-position: 0 -567px; width: 41px; height: 41px;
    }

    .heroRightNav:hover {
        background-position: 0 -749px; width: 41px; height: 41px;
    }

.swipe-wrap {
    position: relative;
    overflow: hidden;
}

.swipe-wrap > div {
  float:left;
  width:100%;
  position: relative;
}

.slide-caption {
    height: 70%;
    width: 100%;
    max-width: 1200px;
    position: absolute;
    background-image: url('../../Content/Images/Title-gradient.png');
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 100%;
}

.slide-txt-hldr {
    position: relative;
    top: 40px;
    left: 80px;
    text-align: left;
    max-width: 89%;
}

    .slide-txt-hldr > h1, .slide-txt-hldr > h2, .slide-txt-hldr > p {
        font-family: "pragmatica-web",arial,helvetica,sans-serif;
        font-size: 3.2rem;
        line-height: 1.1;
        color: #e62899;
    }

    .slide-txt-hldr > h2 {
        font-size: 3.00rem;
    }

    .slide-txt-hldr > p {
        width: 45%;
        color: #6d6c70;
        line-height: normal;
        font-size: 1.20rem;
        margin-left: 4px;
    }

    .slide-txt-hldr > .button {
        border-radius: 3px;
        margin-top: 25px;
    }

/* CSS Animations */

/* anim helpers */

.opaque {
	filter: alpha(opacity=00);
	opacity: 0.0;
}

.opacVis {
	filter: alpha(opacity=100);
	opacity: 1;
}

.notvis {
    visibility: hidden;
}

/* custom */
.addCSSTrnsHlfSec
{
	-webkit-transition: all 0.5s ease-in-out;
	   -moz-transition: all 0.5s ease-in-out;
	     -o-transition: all 0.5s ease-in-out;
	    -ms-transition: all 0.5s ease-in-out;	
	        transition: all 0.5s ease-in-out;
}

.addCSSTrnsFullSec {
	-webkit-transition: all 1s ease-in-out;
	   -moz-transition: all 1s ease-in-out;
	     -o-transition: all 1s ease-in-out;
	    -ms-transition: all 1s ease-in-out;	
	        transition: all 1s ease-in-out;
}

.matrixIn {
    -webkit-transform: matrix(0.903,0,-0.093,0.877,-12.636,-25.123);
    -moz-transform: matrix(0.903,0,-0.093,0.877,-12.636px,-25.123px);
    -ms-transform: matrix(0.903,0,-0.093,0.877,-12.636,-25.123);
    -o-transform: matrix(0.903,0,-0.093,0.877,-12.636,-25.123);
    transform: matrix(0.903,0,-0.093,0.877,-12.636,-25.123);
}

.scaleNorm
{
	  -webkit-transform: scale(1);
	  -webkit-transition: all 200ms ease-out;
	  -moz-transform: scale(1);
	  -moz-transition: all 200ms ease-in-out;
	  -o-transform: scale(1);
	  -o-transition: all 200ms ease-in-out;
	  -ms-transform: scale(1);
	  -ms-transition: all 200ms ease-in-out;
}

.scaleOut
{
	  -webkit-transform: scale(.7);
	  -webkit-transition: all 200ms ease-out;
	  -moz-transform: scale(.7);
	  -moz-transition: all 200ms ease-in-out;
	  -o-transform: scale(.7);
	  -o-transition: all 200ms ease-in-out;
	  -ms-transform: scale(.7);
	  -ms-transition: all 200ms ease-in-out;
	  padding: 0 3px;
}

/* animate.css (http://daneden.github.io/animate.css/) */

.animated, .animatedFast {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animatedFast {
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

/* Admin */

.admnDispMsg {
    position:absolute;
    left: 0;
    top: 0;
    padding: 5px;
	background-color: grey;
	opacity: .6;
	filter: alpha(opacity=60);
}

    .admnDispMsg > div {
        margin-top: 20%;
        text-align: center;
        color: #ffffff;
        font-weight: bold;
        font-family: "pragmatica-web",arial,helvetica,sans-serif;
    }