/* app css stylesheet */
@font-face {
    font-family: bmrea;
    src: url(../fonts/bmrea.woff);
}

@font-face {
    font-family: fingerPaint;
    src: url(../fonts/FingerPaint-Regular.woff), url(../fonts/FingerPaint-Regular.ttf);
}

body {
	font-family: fingerPaint, sans-serif;
}

.masthead-brand {
    text-transform: uppercase;
}

.mastfoot {
	font-family: sans-serif;
}

.errorMsg {
    color: #f00;
}

.panel-heading {
	height: 48px;
}

.leftAligned {
	float:left;
}

.rightAligned {
	float: right;
}

#ideaPage {
    display: none;
}

#ideaPanel {
    -webkit-perspective: 600px;
    -moz-perspective: 600px;
    perspective: 600px;
}

#ideaPanel .panelFront {
    width: 100%;
    z-index: 900;
    box-shadow: 0 1px 5px rgba(0,0,0,0.9);
    -webkit-transform: rotateX(0deg) rotateY(0deg);
    -moz-transform: rotateX(0deg) rotateY(0deg);
    transform: rotateX(0deg) rotateY(0deg);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    /* -- transition is the magic sauce for animation -- */
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

#ideaPanel.flip .panelFront {
    z-index: 900;
    box-shadow: 0 15px 50px rgba(0,0,0,0.2);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

/*#ideaPanel.flip .panelFront .panel-heading {
    background-color: #d9dff7;
}*/


#ideaPanel .panelBack {
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 800;
    background-color: #D9EDF7;
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-179deg); /* setting to 180 causes an unnatural-looking half-flip */
    transform: rotateY(-179deg);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    /* -- transition is the magic sauce for animation -- */
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

#ideaPanel.flip .panelBack {
    z-index: 1000;
    -webkit-transform: rotateX(0deg) rotateY(0deg);
    -moz-transform: rotateX(0deg) rotateY(0deg);
    transform: rotateX(0deg) rotateY(0deg);
    box-shadow: 0 15px 50px rgba(0,0,0,0.2);
}

h1 {
    font-variant: small-caps;
}

.panel,
input,
textarea {
  color: #000;
}