/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
/***********************************************************************************************
property Ad History pages
************************************************************************************************/
 :root{
 /*	--darkColor:#152d4d;*/
 	--darkColor:#24386a;  
 	 /*--mediumColor:#A2AAAD;*/
 --mediumColor:#c4c4c4; 
 	--lightColor:#fff;
 	--goColor:green;
 	--stopColor:red;
 	--warningColor:orange;
 	--blackColor:#000;
 }
#subForm{
	width:100%;
}
#writingPrompt{
width:100%;
}
.actionButton{
	font-weight:600;
	font-size:1em;
	font-family: 'Lato', sans-serif;
	cursor:pointer;
	color:var(--lightColor);
	border-radius: 8px;
	width:200px;
	line-height:2em;
	text-align:center;
	margin-left:10px;
	float:left;

}
.actionButton:hover{
	border:4px double var(--darkColor); 
	background:var(--lightColor);
	color:var(--darkColor);
	animation:psShake 1s;
}
.actionButton:focus {outline:none;}
#submitGPT{ border:4px double var(--lightColor); background:var(--darkColor);}
#submitGPT:hover{border:4px double var(--darkColor);background:var(--lightColor);}

input {border: 5px solid white; -webkit-box-shadow: inset 0 0 4px  rgba(0,0,0,0.1),    0 0 8px rgba(0,0,0,0.1); -moz-box-shadow: inset 0 0 4px  rgba(0,0,0,0.1),    0 0 8px rgba(0,0,0,0.1); box-shadow: inset 0 0 4px  rgba(0,0,0,0.1),    0 0 8px rgba(0,0,0,0.1); padding: 7px;background: rgba(255,255,255,0.5);margin: 0 0 5px 0;}

/* class applies to select element itself, not a wrapper element */
.select-css {
    position: relative;
    max-width: 400px;
    min-width: 180px;
    margin: 0 auto;
    border: 4px double #fff;
    background-color: var(--darkColor);
    padding: 12px 55px 15px 15px;
    color: #fff;
    font-size: 1.5em;
    font-family: 'Lato',sans-serif;
    border-radius:5px;
}
.cb{clear:both;width:100%;}
#myLabel{width:100%;
	font-size: 1.5em;
	font-family: 'Lato',sans-serif;
	color: var(--darkColor);
	padding-top:50px;
}
#charCount{
    color: var(--darkColor);
    font-size: 1.5em;
    font-family: 'Lato',sans-serif;
    font-weight:900;
    text-align:center;
    display:none;
}
#charCount:before{
	content: "Characters:";
}
#writingPrompt{
	width:100%;
	border: 4px double var(--darkColor);
	border-radius:5px;
	padding:10px;
	margin-top:30px;
	display:none;
}
@keyframes psShake {
  0% {transform: scale3d(1,1,1);}
  20%{transform: scale3d(1.02,1.02,1);}
  40%{transform: scale3d(.98,.99,1);}
  60% {transform: scale3d(1.01,1.01,1);}
  80% {transform: scale3d(.99,.99,1);}
  100% {transform: scale3d(1,1,1);}
}