.spacer {
	clear: both;
}

/* fullgreen box */
.full_greenbox_wrap
{
	background-color: #8bbd12;
    display: block;
    border-color: #e8f2d0;
    color: #ffffff;
    padding: .6em 1em .6em 1em;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    max-width: 100%; 
}

.full_greenbox_wrap p
{
	margin: 0;
}

/* green border & checkmarks box */
.checkmarkslist-main-wrap
{
	border-color: #6f970e;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-width: 2px;
    border-style: solid;
    max-width: 100%; 
}

.checkmarkslist-title
{
	background-color: #8bbd12;
    color: #FFFFFF;
    -webkit-border-top-left-radius: 2px;
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topleft: 2px;
    -moz-border-radius-topright: 2px;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    display: block;
    padding: .5em 1em;
    font-weight: 700;
    font-size: 1.1em;
}

.checkmarkslist-list-wrap
{
	padding: 1em;
    padding-bottom: 0;
    color: #444;
}

.checkmarkslist-list-ul
{
	list-style: none;
    margin: 0 0 1.5em 0;
    padding: 0;
}

.checkmarkslist-list-ul-li
{
	position: relative;
    list-style-type: none;
    display: block;
    line-height: 1.3em;
    margin: 0;
    padding: 4px 0 4px 2em ;
}

.checkmarkslist-list-ul-li .fa.fa-check
{
	color: #8bbd12;
	position: absolute;
    left: 0;
    top: 8px;
    width: 1.3em;
    height: 1.3em;
    line-height: 1.3em;
    text-align: center;
    font-family: FontAwesome;
}

.checkmarkslist-list-ul-li .fa.fa-check:before {
    content: "\e00c";
    font-family: iconfont;
}

/* pro con shortcode */
li.pro-li,
li.con-li
{
	padding-left: 1.5em;
	list-style: none;
	margin-left: -0.2em;
}

li.pro-li:before {
    font-family: iconfont;
    color: #8CBE13;
    content: '\e819';
    font-size: inherit;
    margin: 0 .3em 0 -.9em;
    position: relative;
    top: .1em;
}

li.con-li:before {
    font-family: iconfont;
    color: #a2a2a0;
    content: '\e81A';
    font-size: inherit;
    margin: 0 .3em 0 -.9em;
    position: relative;
    top: .1em;
}



/* background color shortcode */
.bgc-sc-container
{
   /*  padding: 10px;	 */
    margin-top: 15px;
    margin-bottom: 15px;
}

.bgc-sc-inner
{
	margin: auto;
}



/* recommendation box shortcode */
.reco-sc-container
{
	padding: 15px 0px;
	display: table;
	border: solid 2px #edeeee;
}

.reco-sc-logo-wrap,
.reco-sc-list-wrap,
.reco-sc-cta-wrap
{
	display: table-cell;
	vertical-align: middle;
}

.reco-sc-logo-wrap,
.reco-sc-cta-wrap
{
	padding: 0 35px;
	max-width: 200px;
}

.reco-sc-list
{
	padding: 0 0 0 15px;
    max-width: 350px;
}

.reco-sc-list-wrap .reco-sc-list li
{
	margin-top: 7.5px;
    margin-bottom: 7.5px;
    list-style: none;
}

.reco-sc-list-wrap .reco-sc-list li:before
{
	content: "\e00c";
    font-family: iconfont;
    margin:0 5px 0 -15px;
    color: #8cbe13;
}


/* screen video shortcode */
.sv-sc-container
{
	display: block; 
	width: 400px; 
	height: 332px; 
	background-image: url("../../img/images/lcd-monitor-400-px.png"); 
	position: relative;
}

.sv-sc-vid-frame
{
	width: 311px; 
	height: 200px;
	display: block; 
	position: relative;
	top: 39px; 
	left: 74px;
}

.sv-sc-container.ended::after{
	content:""; 
	position: absolute; 
	cursor: pointer; 
	background-color: black; 
	background-repeat: no-repeat; 
	background-position: center; 
	background-size: 34px 34px; 
	background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiB2aWV3Qm94PSIwIDAgNTEwIDUxMCI+PHBhdGggZD0iTTI1NSAxMDJWMEwxMjcuNSAxMjcuNSAyNTUgMjU1VjE1M2M4NC4xNSAwIDE1MyA2OC44NSAxNTMgMTUzcy02OC44NSAxNTMtMTUzIDE1My0xNTMtNjguODUtMTUzLTE1M0g1MWMwIDExMi4yIDkxLjggMjA0IDIwNCAyMDRzMjA0LTkxLjggMjA0LTIwNC05MS44LTIwNC0yMDQtMjA0eiIgZmlsbD0iI0ZGRiIvPjwvc3ZnPg==);

	width: 311px; 
	height: 200px;
	top: 39px; 
	left: 74px;
}

.sv-sc-container.paused::after{
	content:""; 
	position: absolute; 
	cursor: pointer; 
	background-color: black; 
	background-repeat: no-repeat; 
	background-position: center; 
	background-size: 30px 30px; 
	background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEiIHdpZHRoPSIxNzA2LjY2NyIgaGVpZ2h0PSIxNzA2LjY2NyIgdmlld0JveD0iMCAwIDEyODAgMTI4MCI+PHBhdGggZD0iTTE1Ny42MzUgMi45ODRMMTI2MC45NzkgNjQwIDE1Ny42MzUgMTI3Ny4wMTZ6IiBmaWxsPSIjZmZmIi8+PC9zdmc+);

	width: 311px; 
	height: 200px;
	top: 39px; 
	left: 74px;
}


/* content box shortcode */
.cb-sc-container
{
	padding: 25px;
	display: table;
	border: solid 2px #f6f6f8;
}

.cb-sc-img-wrap,
.cb-sc-textbox-wrap
{
	display: table-cell;
	vertical-align: middle;
}

.cb-sc-img-wrap
{
	padding: 0 25px;
}

.cb-sc-img-wrap-left
{
	padding-left: 50px;
}

.cb-sc-img-wrap-right
{
	padding-right: 50px;
}

.cb-sc-textbox-wrap-left
{
	text-align: left; 
}

.cb-sc-textbox-wrap-right
{
	text-align: right; 
}

.cb-sc-textbox-title
{
	margin: 0;
}

.cb-sc-textbox-text
{
	margin: 0;
	color: #272727; 
}

.cb-sc-img-wrap img
{
	max-width: unset; 
}


/* columns shortcode */
.sc-column-container
{
	display: flex;
    flex-wrap: wrap;
    margin-top: 15px;
    margin-bottom: 15px;
}

.sc-column
{
	flex: 1 1 150px;
	padding: 15px;
}

.sc-column-container .sc-column img
{
	width: unset;
}


/******* RESPONSIVE *******/
/* tablet */
@media(max-width: 970px)
{
	.reco-sc-container
	{
		display: block;
	}
	
	.reco-sc-cta-wrap
	{
		display: block;
	}
	
	.reco-sc-list
	{
		padding: 0 15px 0 15px;
	}
	
	.reco-sc-logo-wrap, .reco-sc-cta-wrap 
	{
	    padding: 0 15px;
	}
}


/* phone */
@media(max-width: 600px) {
	
	.reco-sc-logo-wrap,
	.reco-sc-list-wrap
	{
		display: block;
	}
	
	.reco-sc-logo-wrap img
	{
		margin: 0 auto;
	}
	
	.cb-sc-container
	{
	    float: none !important;	
	    max-width: unset !important;
	    margin: 15px 0 !important;
	    padding: 15px;
	}
	
	.cb-sc-img-wrap-right
	{
		padding: 0 0 0 15px;
	}
	
	.cb-sc-img-wrap-left
	{
		padding: 0 15px 0 0;
	}
	
	.cb-sc-img-wrap img
	{
		max-width: 100px;
	}
}


/* phone */
@media(max-width: 560px)
{
	.sv-sc-container
	{
	    width: 300px;
    	height: 249px;
		background-size: contain;
		float: none !important;
		margin: 15px auto !important;
	}
	
	.sv-sc-vid-frame,
	.sv-sc-container.paused::after,
	.sv-sc-container.ended::after
	{
		width: 233px;
    	height: 143px;
    	top: 29px;
    	left: 55px;
	}
}




