*
{
	padding:0;
	margin:0;
}
body
{
	background: #26192b;
	margin:0;
	padding:0;
	font-family: "Montserrat", "Avenir";
	font-family: 'Cormorant Garamond', serif;
	text-align:center;
}
#heading
{
	color:white;
	text-align:center;
	background: #af04d7;
	text-transform: uppercase;
	line-height: 1.1;
	padding:20px 0;
	width:100%;
}
#stripe
{
	background: #cebfd8;
	padding: 2px 0;
}
#message
{
	color:#000;
	font-size:1.1em;
}
#wrapper
{	
	border: 10px solid transparent;
	margin: 50px auto auto;
	display:table;
	font-size:80px;
	text-align:center;
	min-width:308px;
}
.cell
{
	border: 2px solid #af04d7;
	float:left;
	width:100px;
	height: 100px;
	background: transparent;
}

#rowA .cell:nth-child(1),
#rowB .cell:nth-child(1),
#rowC .cell:nth-child(1)
{
	border-left:none;
}

#rowA .cell:nth-child(3),
#rowB .cell:nth-child(3),
#rowC .cell:nth-child(3)
{
	border-right:none;
}

#rowA .cell
{
	border-top:none;
}
#rowC .cell
{
	border-bottom:none;
}	
#reset
{
	margin-top:25px;
	color:#14bdac;
	border:2px solid #14bdac;
	border-radius:20px;
	background: transparent;
	outline: none;
	padding: 6px 20px;
	font-size:40px;
	text-align: center;
}
#reset:hover
{
	color:#fff;
	border:2px solid #14bdac;
	border-radius:20px;
	background: #14bdac;
	outline: none;
	padding: 6px 20px;
	font-size:40px;
	text-align: center;
}
#result
{
	height:50px;
	font-size: 2.4em;
}
.result
{
    color: #26192b;
}
.resultO
{
	background:#aaece9;
	color: #26192b !important;
}
.resultX
{
	background:#ffc136; 
	color: #26192b !important;
}
.playerO
{
	color:#aaece9;
}
.playerX
{
	color:#ffc136 ;
}

/*Score Keeper styling marker-start*/

#scoreKeeper
{
	max-width:400px;
	margin: 10px auto 0;
	display:flex;
	justify-content: center;
	align-items: center;
	flex-wrap: no-wrap;
	font-size:14px	;
	box-sizing: border-box;
}
.score
{
	background:#fff;
	background:linear-gradient(180deg, #e1b1f4 20%, #af04d7);
	margin:0 5px;
	width:50%;
	border-bottom: 2px solid #af04d7;
	border-radius:8px;
	box-shadow: 0 4px 5px rgba(0,0,0,.16);
	padding:2px;
	transition: 0.2s;
}
.player
{
	float:left;
	margin-left:15px;
	font-weight: bold;
}
.value
{
	float:right;
	margin-right: 15px;
	font-weight: bold;
}
.active
{
	border-color:#14bdac;
}