*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/**
 * All your custom CSS should go into this file
 */
 
 table.vm td, table.vm th{
	 vertical-align:middle;
 }

body {
   adding-top: 15px;
   ackground:url(../img/tex.png); 
   color:#555;
}

.btn-primary {
  background-color: #9d331d;
  background-image: -moz-linear-gradient(top, #9d261d, #9d461d);
  background-image: -ms-linear-gradient(top, #9d261d, #9d461d);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#9d261d), to(#9d461d));
  background-image: -webkit-linear-gradient(top, #9d261d, #9d461d);
  background-image: -o-linear-gradient(top, #9d261d, #9d461d);
  background-image: linear-gradient(top, #9d261d, #9d461d);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9d261d', endColorstr='#9d461d', GradientType=0);
  border-color: #9d461d #9d461d #5c2911;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #9d461d;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */

  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled] {
  background-color: #9d461d;
  *background-color: #873c19;
}
.btn-primary:active,
.btn-primary.active {
  background-color: #723315 \9;
}

.btn-primary,
.hero-unit .btn-primary {
  background-color: #e7d785;
  background-image: -moz-linear-gradient(top, #fffeb8, #c49c38);
  background-image: -ms-linear-gradient(top, #fffeb8, #c49c38);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fffeb8), to(#c49c38));
  background-image: -webkit-linear-gradient(top, #fffeb8, #c49c38);
  background-image: -o-linear-gradient(top, #fffeb8, #c49c38);
  background-image: linear-gradient(top, #fffeb8, #c49c38);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffeb8', endColorstr='#c49c38', GradientType=0);
  border-color: #c49c38 #c49c38 #896d27;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #c49c38;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */

  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  *background-color: #e7d785;
  color: #333333;
  text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.25);
}
.btn-primary:hover,
.hero-unit .btn-primary:hover,
.btn-primary:active,
.hero-unit .btn-primary:active,
.btn-primary.active,
.hero-unit .btn-primary.active,
.btn-primary.disabled,
.hero-unit .btn-primary.disabled,
.btn-primary[disabled],
.hero-unit .btn-primary[disabled] {
  background-color: #c49c38;
  *background-color: #b08c32;
}
.btn-primary:active,
.hero-unit .btn-primary:active,
.btn-primary.active,
.hero-unit .btn-primary.active {
  background-color: #9c7c2d \9;
}
.btn-primary:hover,
.hero-unit .btn-primary:hover {
  text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.25);
  color: #333333;
}


.thumbnail, .well{
	background:url(../img/bgtex.png) #eee;
}

#cards{
	text-align:center;
	cursor:pointer;
}

#instructions{
		min-height:150px;
}

#description textarea{
	width:90%;
} 

#current-card{
		border-radius:5px;
		border:1px solid #ccc;
		padding:5px;
		background-color:#fff;
}

.newform table th{
	text-align:right;
	padding-right:5px;
}

.newform legend{
	border-color:#aaa;
	font-size:14px;
	font-weight:bold;
}

.hero-unit {
	background:none transparent;
	padding:20px;
}


.cardlayout{
	background:none transparent;
	clear:both;
    width: 880px;
    margin-left: auto;
    margin-right: auto;
}
.cardlayout td{
	vertical-align:middle;
}
.cardContainer{
	width:50%;
	max-width:300px;
	vertical-align:middle;
}
.cardOuter{
		margin-left:auto;
		margin-right:auto;
		
		width:350px;
		min-height:490px;
		border:1px solid #888;
		border-radius:10px;

        -moz-box-shadow: 2px 2px 5px 1px #888;
        -webkit-box-shadow: 2px 2px 5px 1px #888;
        box-shadow: 2px 2px 5px 1px #888;

        /*-moz-box-shadow: 3px 3px 4px #666;
		-webkit-box-shadow: 3px 3px 4px #666;
		box-shadow: 3px 3px 4px #666;*/

		padding:10px;
		
		background:url(../img/bgnoise.png) orange;
		
		/*
		transform: rotate(-2deg);
		-webkit-transform: rotate(-2deg); 
		-o-transform: rotate(-2deg); 
		-moz-transform: rotate(-2deg);
		*/
}
.card{
		text-align:center;
		padding:20px;
		background:url(../img/bgnoise.png) orange;

		font-family:calibri;
		min-height:448px;
}
.card {
	
}
.card p{
		font-size:18px;
}

.card h2, .card h3{
    line-height:20px;
    text-shadow: 1px 1px #fff;
}

.cardcontrol{
	
}

.cardcontrol blockquote, .cardcontrol textarea{
	font-family:"Comic Sans MS";
	border:1px solid #ccc;
	padding:8px;
	border-radius:10px;
    border:1px solid #aaa;
    border-radius:5px;
	line-height:23px; /* adjust to background texture **/
    width:100%;
}

.cardcontrol button{
	display:block;
	margin-top:15px;
}

/** Only show the last drawn (and first listed) card to the user **
.cards .cardlayout{ display:none;}
.cards .cardlayout:first-child{	display:table;}
*/
.cards .cardlayout button{ display:none;}
.cards .cardlayout:first-child button{	display:block;}

.step-instructions{
	font-size:18px;
	font-family:Calibri;
	/*text-shadow:1px 1px 1px #ccc;*/

}

body.playmode{
	/*background-image:url(http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/retina_wood.png);
	background-image:url(http://subtlepatterns.com/patterns/purty_wood.png);
	
	/*background-image:url(../img/holz.png);*/
	/*background-image:url(../img/crizk.jpg);*/
	
}
body.playmode .cards{
		/*background-image:url(../img/criz.jpg);
		background-position:center;
		background-repeat:no-repeat;*/
}

.sexy_line{ 
	margin-top:20px;
	margin-left:auto;margin-right:auto;
    display:block;
    border:none;
    color:white;
    height:1px;
    background:black;
    background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#000), to(transparent));
	display:none;
}

.tab-content{
	overflow:hidden;
	padding:10px;
	padding-top:20px;
}

.nav-tabs > .active > a, .nav-tabs > .active > a:hover{
		/*background-color:orange;*/
		/*border-color:#000;*/
		border-bottom-color:transparent;
}
.nav-tabs{
	margin-bottom:0;
	/*border-bottom:1px solid #000;*/
}

h1{
		font-size:22px;
}
h4{
	text-shadow:1px 1px 1px #ccc;
	color:#555;
	font-size:15px;
}

.btn-reveal-card{
	margin-top:0px !important;
}

.revealMe{
	display:none;
}

#autosavenotify{
	color:darkgreen;
	font-size:12px;
	font-weight:normal;
}

th{
	font-size:18px;
}

.semi{
	font-size:14px !important;
}

   .btn-go{
	padding:20px 32px;
   }
   
em, .semi-hint{
	   color:#555;
	   font-style:normal;
   }
   
dl dd{
	margin-top:5px;
	margin-bottom:10px;
	clear:both;
}
dl dt{
	clear:both;
	font-size:16px;
}

img{
	max-width:initial;
}

.interactive{
	cursor:pointer;
}

.box, .greet{
	border:1px solid #ccc;
		-moz-box-shadow: 3px 3px 4px #666;
		-webkit-box-shadow: 3px 3px 4px #666;
		box-shadow: 3px 3px 4px #666;
		
	border-radius:8px;
	padding:10px;
	
	margin-bottom:10px;
}


.warn{
	background-color:	#FCF8E3;
	color:#C09853;
}
.success{
	color: #468847 !important;
	background-color: #DFF0D8  !important;
	/*border-color: #D6E9C6;*/
}

.card p{
    text-align: left;
}

.cardlayout h2{
   font-size:25px;
   /*color:#08c;*/
}
.card h2{
    color:#333;
}


.miniCard{
    text-align: center;
    margin: 10px;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 1px 1px #aaa;
    background-color: #ffc4b7;
    height: 150px;
    width: 110px;
    float:left;
    font-size: 13px;
}

.sessionID{

}

ul#cardNav{
    width: 880px;
    margin-left: auto;
    margin-right: auto;
    padding-left:20px;
}

#cardNav li.active{
    border:2px solid #000 !important;
}

#cardNav > .active > a, #cardNav > .active > a:hover{
    background:none transparent;
    border:0;
}
#cardNav>li>a{
    margin:0;
    padding:0;
    border:0;
}

#cardNav>li>a:hover{
    background:none transparent;
    border:0;
}

.nextButton{
    background:none transparent;
    border:0;
}