/* CSSD-SFW */
body {
	background: #FFF;
	background-repeat: repeat;
	background-position: center center;
	background-attachment: fixed;
	line-height: 1.4em;
}

h1, h2, h3 {
	letter-spacing: -1px;
}
p {
	letter-spacing: 0.1px;
	line-height: 1.4em;
}
div[stdll] {
	letter-spacing: 0.1px;
	line-height: 1.4em;
}

.headerSintaskFramework {
	background: transparent url(https://selteer.com/images/logo/selteercolorlogo.png) no-repeat scroll 50% 50% / 70px 70px;
	margin: 2px 1% 2px 13%;
	width: 70px;
	height: 70px;
	cursor: pointer;
}

h2.head {
	color: #45898F;
	background: #FFFFFF;
	font-family: Arial;
	font-size: 22px;
	border-bottom: 1px solid #45898F;
	font-weight: lighter;
	letter-spacing: -1px;
	padding: 2% 15%;
}
h2.title {
	color: #FFFFFF;
	background: #45898F;
	font-family: Arial;
	font-size: 20px;
	font-weight: bold;
	letter-spacing: -1px;
	padding: 20px 20px;
}
div.contentArea {
	padding: 40px 15%;
	margin: 0px auto;
	font-size: 16px;
	color: #FFF;
	/*background: #4D9AA1;*/
	background: linear-gradient(60deg, rgb(53, 92, 125), rgb(108, 91, 123), rgb(211, 144, 86));
}
div.contentArea[type='2'] {
	padding: 40px 15%;
	margin: 0px auto;
	font-size: 16px;
	color: #555;
	background: #FAFAFA;
}
div.contentArea[type='3'] {
	padding: 40px 15%;
	margin: 0px auto;
	font-size: 16px;
	color: #555;
	background: #EAEAEA;
}
div.contentAreaTwoSide {
	box-sizing: border-box;
	width: 50%;
	position: relative;
	float: left;
	padding: 5px;
}
div.contentAreaTwoSide > img[art-image] {
	margin-left: 15%;
	width: 300px;
}

div.contentAreaThreeSide {
	box-sizing: border-box;
	width: 33%;
	position: relative;
	float: left;
	padding: 10px;
}
div.contentAreaThreeSide > .innerContent[color='1'] {
	background: #A0B4C7;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent[color='2'] {
	background: #4989A2;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent[color='3'] {
	background: #80A774;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent[color='4'] {
	background: #5AAEAE;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent[color='5'] {
	background: #607d8b;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent[color='6'] {
	background: #ECA945;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent[color='7'] {
	background: #7527b0;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent[color='8'] {
	background: #E91E63;
	border-radius: 4px;
	padding: 20px;
}
div.contentAreaThreeSide > .innerContent > [prodBody] {
	min-height: 250px;
	max-height: 250px;
}
div.contentAreaThreeSide > .innerContent > [prodFooter] {
	margin-top: 10px;
}

div.contentTwo {
	padding: 20px;
}
div.borderLine {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #DADADA;
}
div.borderSpaceMini {
	margin-top: 5px;
	padding-top: 5px;
}
div.borderSpaceMiniSuper {
	margin-top: 5px;
}
div.borderSpace {
	margin-top: 20px;
	padding-top: 20px;
}
span.thisTagging {
	font-size: 13px;
	padding: 1px 5px;
	border: 2px solid #EAEAEA;
	background: #EAEAEA;
	color: #555;
	font-weight: bolder;
	border-radius: 4px;
}
.noted {
	padding: 15px;
	border: 1px solid #EA9F2D;
	color: #555;
}
.orangeBubble {
	font-size: 13px;
	padding: 1px 5px;
	border: 2px solid #EA9F2D;
	background: #EA9F2D;
	color: #FFF;
	font-weight: bolder;
	border-radius: 2px;
	display: inline-block;
}
input[type='submit'] {
	padding: 2px 6px;
	font-size: 13px;
	border: 2px solid #DADADA;
	border-radius: 4px;
	color: #555;
	margin-top: 2px;
	margin-bottom: 2px;
	cursor: pointer;
	transition: all 0.2s linear 0s;
}
input[type='submit']:hover {
	box-shadow: 0px 0px 4px #111;
}
ul {
	margin-left: 20px;
}

input.toast {
	padding: 5px 15px;
	border-radius: 2px;
	border: 1px solid #555;
	width: 100%;
	box-sizing: border-box;
	margin-bottom: 2px;
}
button.toast {
	border: 2px solid #555;
	border-radius: 3px;
	padding: 5px 15px;
	display: inline-block;
	margin-right: 5px;
	margin-bottom: 2px;
}
input[top] {
	border: 2px solid #FFFFFF;
	padding: 10px 20px;
	color: #555555;
	width: 100%;
	box-sizing: border-box;
	border-bottom: 2px solid #DADADA;
	border-radius: 6px 6px 0px 0px;
}
input[middle] {
	border: 2px solid #FFFFFF;
	padding: 10px 20px;
	color: #555555;
	width: 100%;
	box-sizing: border-box;
	border-bottom: 2px solid #DADADA;
}
input[bottom] {
	border: 2px solid #FFFFFF;
	padding: 10px 20px;
	color: #555555;
	width: 100%;
	box-sizing: border-box;
	border-radius: 0px 0px 6px 6px;
}

button[std-one] {
	border: 2px solid #FFFFFF;
	padding: 10px 20px;
	color: #67B26F;
	font-weight: bold;
	cursor: pointer;
	background: #FFFFFF;
	width: 100%;
	box-sizing: border-box;
	border-radius: 6px;
}
button[std-two] {
	border: 2px solid #FFFFFF;
	padding: 10px 20px;
	color: #FFFFFF;
	font-weight: bold;
	cursor: pointer;
	background: transparent;
	width: 100%;
	box-sizing: border-box;
	border-radius: 6px;
}
button[std-three-bottom] {
	border: 2px solid #FFFFFF;
	padding: 10px 20px;
	color: #FFFFFF;
	font-weight: bold;
	cursor: pointer;
	background: transparent;
	width: 100%;
	box-sizing: border-box;
	border-radius: 6px;
	bottom: 0;
}

.justifyAlign {
	text-align: justify;
}

@media only screen and (max-width: 1000px) {
	div.contentAreaThreeSide {
		width: 50%;	
	}
}
@media only screen and (max-width: 700px) {
	.headerSintaskFramework {
		margin: 2px 1% 2px 3%;
	}
	div.contentArea {
		padding: 40px 7%;
	}
	div.contentArea[type='2'] {
		padding: 40px 7%;
	}
	div.contentAreaTwoSide {
		width: 100%;	
	}
	div.contentAreaTwoSide > img[art-image] {
		margin-left: 20%;
		width: 250px;
	}
	.theFooter {
		padding: 40px 7%;
	}
}
@media only screen and (max-width: 700px) {
	div.contentAreaThreeSide {
		width: 100%;	
	}
}