.flex-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.strategyTypeSelector h1
{
	margin-top:-25px;
}

.st_category
{
	border:1px solid #777;
	cursor:pointer;
	padding:0px;
	
}

.st_category.selected
{
	cursor:inherit;
	border:2px solid orangered;
}




.st_category .subCatUnit
{
	float: left;
    display: table;
    width: 30%;
    margin-right: 4px;
    margin-bottom: 4px;
    padding: 4px;
    border: 1px solid #ddd;
    cursor: pointer;
    background-color: #fafafa;
    height: 80px;
	
}
.st_category.equity
{
	padding-bottom:15px;
	margin-bottom:15px;
	margin-top:20px;
	background-color: #e0eefa;
}
.st_category.equity .subCatUnit
{
	height:65px;
}

.st_category.cta_like
{
	background-color: #d7ecd7;
}


.st_category.options
{
	background-color: #fdffcc;
}

.st_category.unselectable
{
	cursor:not-allowed;
	background-color:#eeeeee;
	border:1px solid #ccc;
}


.subCatUnit
{
	position: relative;
}

.subCatUnit .removeArea
{
	position: absolute;
	right:4px;
	top:2px;
}
.subCatUnit .helpArea
{
	position: absolute;
    right: 4px;
    bottom: 2px;
}
.subCatUnit .removeArea .iminus,
subCatUnit .helpArea .igetinfo
{
	display:none;
	font-size:15px;
	color:red;
	cursor:pointer;	
}
.iminus.example
{
	color: red;
    font-size: 13px;
    margin-left: 3px;
    position: relative;
    top: 1px;
    margin-right: 2px;
}
.subCatUnit .igetinfo
{
	color:#9a9a9a;
}

.editMode .subCatUnit.selected .removeArea .iminus
{
	display:inline-block;
}

.subCatUnit.selected
{
	cursor:inherit;
	border:1px solid green;
	background-color:#e8ffe2;
}
.subCatUnit .subCatLabel
{
	color: #000;
    font-size: 13px;
    text-align: center;    
    display: table-cell;
    vertical-align: middle;
}

.categoryLabel
{
	padding: 4px 14px;
    border-bottom: 1px solid #838383;
    border-right: 1px solid #838383;
    display: inline-block;
    margin-bottom: 14px;
    border-bottom-right-radius: 4px;
    text-transform: uppercase;
    color: #fff;
    background-color: #adadad;
}

.st_category.selected .categoryLabel
{
	background-color: #ff7a00;
}

.unselectable .categoryLabel
{
	background-color:#d6d6d6;
	border-color:#c1c1c1;
}
.editMode .st_category.unselectable .subCatUnit
{
	background-color:#f2efef;
}

.editMode .unselectable .subCatUnit .subCatLabel
{
	color:#a1a1a1;
}

.modalDialogContent .buttonRow
{
	margin-top:10px;
}
.modalDialogContent p
{
	color:#000 !important;
}
.modalDialogContent .buttonRow .c2g-btn
{
	float:right;
	margin-left:10px;
}
.modalDialogContent h1
{
	margin-bottom:25px;
}
.strategyTypeSelector
{
	position: relative;
}
.messageUnit
{
	position: absolute;
    z-index: 2;
	top:37%;
	width:100%;
}
.messageUnitInner
{
    padding: 20px 15px;
	background-color:white;
    border: 2px #222 solid;
    border-radius: 4px;
    margin-left: auto;
    margin-right: auto;
    width: 85%;
    box-shadow: 1px 1px 8px 0px rgba(26, 26, 26, 0.55);
}

.messageUnitInner.error
{
	background-color: #f9e3e3;
}

.messageUnitInner p
{
	line-height: 1.8 !important;
	text-align: center;
}

.strategyTypeSelector .selectedSoFar
{
	display:none;
}
.strategyTypeSelector.selected0 .selectedSoFar.n0
{
	display:block;
}
.strategyTypeSelector.selected1 .selectedSoFar.n1
{
	display:block;
}
.strategyTypeSelector.selected2 .selectedSoFar.n2
{
	display:block;
}

.descriptiontext
{
	padding: 10px;
	font-size:14px;
	color:#222;
	line-height: 1.8;
	width:280px;
	position: relative;
}

.descriptiontext h3
{
	margin-top:10px;
	color:#666;
	font-size:15px;
}

.descriptiontext .categoryArea
{
	background-color: #669c01;
    color: white;
    padding: 6px 8px;
    border: 1px solid #e0e0e0;
    position: absolute;
    top: -32px;
    left: -13px;
    font-size: 13px;
    line-height: 1;
}
.descriptiontext .stratcatlabel
{
	color:#f0f0f0;
}
.buttonAreaText
{
    display: inline-block;
    max-width: 430px;
    float: left;
    margin-right: 10px;
    padding-left: 5px;
}
.buttonAreaText p
{
	margin-top:0 !important;
}

.shaking {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
}

.textheavy h1
{
	margin-bottom:20px !important;
}
.textheavy p
{
	font-size: 14px !important;
    line-height: 1.8 !important;
}


  
@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}