/* common */

@viewport {
	width: device-width;
	zoom: 1.0;
}

body {
background-color: #FFFFFF;
color: #000000;
margin: 0px;
padding: 0;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 16px;
}

p {
color: #000000;
font-family: Verdana, Geneva, Tahoma, sans-serif;
font-weight: 500;
}




/* Homepage plus */


.title-wrap{

    columns: 25rem 2;
    column-gap: 1.5rem;
	max-width: 980px;
	background-color: #ffffff;
	margin-left: auto;
	margin-right: auto;

}

.title-wrap section{
	display: block;
	float: left;
}

* {
	box-sizing: border-box;
  }
  
  .title-flex-container {
	display: flex;
	flex-wrap: wrap;
	text-align: center;
	max-width: 980px;
  }
  
  .title-flex-item-left {

	padding: 10px;
	flex: 25%;
  }

  .title-flex-item-mid {

	padding: 10px;
	margin: auto;
	vertical-align: middle;
	flex: 15%;
  }
  
  .title-flex-item-right {

	padding: 10px;
	flex: 50%;
  }


  .the-box {
	padding: 5px; 
	color: #000000; 
	border: outset 1px #aaaaaa; 
	border-radius: 25px 25px 25px 25px; 

}


  .hp-flex-container2 {
	display: flex;
	flex-wrap: wrap;
	text-align: center;
	max-width: 980px;
  }
  
  .hp-flex-item2-left {

	padding: 10px;
	flex: 50%;
  }

  
  .hp-flex-item2-right {

	padding: 10px;
	flex: 50%;
  }


  .tabs-flex-container {
	display:flex;
	flex-wrap: wrap;
	text-align: left;
	max-width: 900px;
	margin: auto;
		
  }
  
  .tabs-flex-item-left {

	padding: 10px;
	flex: 33%;

  }

  .tabs-flex-item-mid {

	padding: 10px;
	flex: 33%;

  }
  
  .tabs-flex-item-right {

	padding: 10px;
	flex: 33%;

  }

  .tabs-guts{

	background-color: #FFE6DD;
	padding: 10px;
	height: 100%;

  }

  .bars {
	text-align: left; 
	font-size: 18px; 
	font-weight: 500; 
	color: #fefefe; 
	font-family: verdana, arial; 
	padding-bottom: 5px;
}

p.tab-top{
	background-color: #ff9c00; 
	padding: 5px; 
	text-align: center; 
	border-radius: 25px 25px 0px 0px; 
	margin: 0;

}


  .real_button {
	color: #fefefe;
	background-color: #ce3100;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 700;
	text-align: center;
	border: 1px solid #ce3100;
	padding: 5px;
	border-radius: 25px;
	-moz-border-radius: 25px;
	font-size: 18px;
	margin-bottom: 7px;
	margin-top: 0px;
	box-shadow: 3px 3px 2px #888888;
	-webkit-box-shadow: 3px 3px 2px #888888;
	
	}

.puffy-white{
	padding: 5px; 
	background-color:rgba(255, 255, 255, 0.6); 
	vertical-align: top; 
	text-align: left; 
	border: 1px outset #cccccc; 
	box-shadow: 5px 5px 3px #888888;  
	border-radius: 25px 25px 25px 25px; 
	
}

.puffy-white div{

	text-align: center;
	margin: auto;
}

.puffy-white li{
	margin-bottom: 5px; 
	list-style-image: url(graphics/red-check-sm.png);
}

.puffy-white img.todaright{
padding-left: 10px; 
float: right;
}

.cust-card-cats{

	margin-left: 5px; 
	padding: 15px 5px 15px 5px; 
	border: 1px solid #cccccc; 
	background-image:url(graphics/bgs/birthday/paper4.jpg); 
	background-repeat: repeat; 
	box-shadow: 4px 4px 3px #888888;  
	border-radius: 25px 25px 25px 25px; 
}

.cust-card-cats div.card-box{
	display:inline-block;
	padding: 5px 0 5px 0;
	margin-bottom: 10px;

}

.cust-card-cats .left-card{
	float: left; 
	max-width: 48%;
	text-align: left; 
	vertical-align: top;

}



.cust-card-cats .right-card{
	float: right; 
	max-width: 48%;
	padding-left: 2%;
	text-align: left; 
	vertical-align: top;

}

.cust-card-cats img{
	border: none; 
	padding-right: 5px; 
	float: left;
	max-height: 75px;
}

.cust-card-cats p{
	margin: 0;
	padding: 0;
}

.cust-card-cats span{
	font-size: .8em; 
	font-family: Arial, Helvetica, sans-serif;
}



.impress {
	color: #888888; 
	font-size: 18px; 
	font-family: verdana, arial; 
	font-weight: 600;
	text-align: center;
}

.impressive {
	font-size: 21px; 
	font-weight: 700;
}


.impresscin-hp {
	color: #CC3300;
	font-size: 18px;
	font-family: verdana, arial;
	font-weight: 600;
	text-align: center; 
	margin-bottom: 0px;
}

.impresscin-hp span{
	font-size: 24px; 
	font-weight: 400; 
	color: #00bb00;
}

.impresscin-hp img{

	padding-right: 20 10px 0 10px;
}

.impresscin {
	color: #CC3300;
	font-size: 1em;
	font-family: verdana, arial;
	font-weight: 600;
	text-align: left;
}

.main_image {
	margin-bottom: 5px; 
	margin-right: 10px; 
	margin-left: 5px; 
	float: left;
}

.sample-title {
	font-size: 19px; 
	font-weight: 600; 
	font-family: georgia, 'times new roman', verdana, arial; 
	text-align: center; 
	margin: 5px;
}

.mini {
	font-size: .9em; 
	font-family: arial;
}
  
  
  /* Responsive layout - makes a one column-layout instead of a two-column layout */
  @media screen and (max-width: 800px) {
	.title-flex-item-right {
	  flex: 100%;
	}

	 .title-flex-item-mid, .title-flex-item-left {
		flex: 45%;
	  }

	  .hp-flex-item2-left, .hp-flex-item2-right {
		flex: 100%;
	  }

	  .tabs-flex-item-mid, .tabs-flex-item-left, .tabs-flex-item-right {
		flex: 100%;
	  }

	  .title-flex-item-left img{

		max-width:100%;
	  }

  }










.subtitles {color: #CC3300; font-family: verdana; font-size: 18px;}
.stand {font-family: "times new roman", tahoma, verdana; color: #000000; font-size: 16px; text-align: left; margin: 1em;}
.rnotes {color: #FF0000; font-size: 11px; font-family: verdana, arial;}
.bnotes {
	font-size: 10px;
	color: #000000;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
}

li.benefits {list-style-image: url(graphics/cin-bullet.png); margin-bottom: 7px; color: #6B78A7; font-size: 16px; font-family: verdana, arial; font-weight: 600;}
li.minis {list-style-image: url(graphics/orange-bullet.gif); margin-bottom: 4px; color: #400000; font-size: 10px; font-family: arial, verdana; font-weight: 500;}



.login {color: #FF9900; font-family: verdana, arial; font-size: 13px; text-align: right; font-weight: 600;}
.customer {font-size: 13px; font-family: arial, verdana; color: #444444;}



.steps {font-size: 16px; font-weight: 600; color: #006000; font-family: verdana, arial; text-align: left;  margin-top: 5px; margin-bottom: 5px;}

.top_ten_cats {font-family: "times new roman", verdana, arial; color: #AA512A; font-size: 12px; font-weight: 600; font-style: italic; text-align: center;}

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #fcef94;
padding: 5px;
left: -1000px;
border: 2px outset #c0c0c0;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;


}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -190px;
left: 100px; /*position where enlarged image should offset horizontally */

}

h2 {font-family: "times new roman", verdana, arial; font-size: 29px; color: #000000; font-weight: 600;}
h2.top_subject {font-family: "times new roman", verdana, arial; font-size: 16px; color: #000000; font-weight: 600; margin: 2px;}

h4 {font-family: verdana, arial; font-size: 18px; color: #000000; font-weight: 600; font-style: italic; margin-left: 1em; margin-right: 1em; margin-right: 1em;}
h5 {font-family: "times new roman", arial; font-size: 13px; color: #000000; font-weight: 500;}
.notes {color: #000000; font-size: 11px; font-family: verdana, arial; text-align: center;}
td td{text-align: left;}
td.center {text-align: center;}
input {font-size: 11px;}
.sidetopbg {background-color: #FF9900;}
.sidebodybg {background-color: #CC3300;}

.middlebg {background-color: #ffffff; padding-left: 5px;}
.rightbg {background-color: #BEBECC;}
.topbg {background-image: url(https://www.createecards.com/graphics/top_yellow_fade.jpg);}
.topbgw {background-image: url(https://www.createecards.com/graphics/top_yellow_fade-wide.gif);}
a.main_menu:visited {color: #0000ff; font-weight: 600;}
a.main_menu:link {color: #0000ff; font-weight: 600;}
a.main_menu:hover {color: #ff0000; font-weight: 600;}
a.main_menu:active {color: #cccccc; font-weight: 600;}

.standard_middle {background-color: #f5f5f5; padding-left: 5px; padding-right: 5px; text-align: left;}
.itsblack {font-family: georgia, "times new roman"; font-size: 18px; color: #000000; font-weight: 500; text-align: left;}

.subblack {font-family: georgia, "times new roman"; font-size: 13px; color: #000000; font-weight: 500; text-align: left; margin-left: 10px;}


.box {color: #000000; font-size: 13px;}
.msub {font-family: "times new roman", verdana, arial; color: #AA512A; font-size: 21px; font-weight: 700; font-style: italic; padding-top: 5px;}
.msubx {font-family: "times new roman", verdana, arial; color: #AA512A; font-size: 14px; font-weight: 600; font-style: italic; margin: 2px;}
li {margin-bottom: 10px;}
.how_to {font-family: verdana, arial; color: #ff0000; font-weight: 600; font-size: 16px; clear: left;}
.how_tox {font-family: verdana, arial; color: #ff0000; font-weight: 600; font-size: 16px; clear: left; margin: 2px;}

.main_image_r {margin-bottom: 5px; margin-left: 10px; margin-right: 5px; float: right;}
.article_title {font-family: verdana, arial; color: #800000; font-size: 21px; font-weight: 600;}
.command-center {font-family: verdana, arial; font-size: 21px; font-weight: 600; color: #800000; text-align: center;}
.quotes {text-align: left; font-size: 12px; border-bottom: 1px dashed #c0c0c0; padding-bottom: 5px; font-family: Verdana, Arial, Helvetica, sans-serif;}
.pindex {text-align: center; font-size: 12px; font-family: Georgia, "Times New Roman", Times, serif; font-weight: 600; padding: 5px; border-top: 1px solid #000000; border-bottom: 1px solid #000000;}

.copybut {background-color: #D4D0C8; font-family: arial; font-size: 13px; border-width: 2px; border-style: outset; margin: 1px; border-color: #FFFFFF,#FFFFFF,#404040,#404040; text-align: center; color:#000000;}






.nmt{
margin-top: 0px;
}

.nmb{
margin-bottom: 0px;
}

.mmt{
margin-top: 5px;
}

.mmb{
margin-bottom: 5px;
}

.fake-li{
margin-left: 20px;
text-align: left;
}







/* new framework css */


.menu-base-mob{
	
	display: none;
}

a {
	text-decoration: none;
}


.framework{
	max-width: 1000px;
	margin: 0;
	padding: 0;
	margin-left: auto;
	margin-right: auto;

}



.middle-container{
display: grid;
  grid-row-gap: 0px;
  grid-column-gap: 0px;
  /*justify-content: space-evenly;*/
  /*align-content: start;*/
  grid-template-areas: 'left-side middle-content middle-content middle-content right-side';

	clear: both;
	margin-top: 10px;
	padding-top: 0;
	padding-left:0;
	padding-right: 0;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	
}

.left-side{
position: relative;
	padding-left: 0px;
	background-color: #CC3300;
	margin-top: 0px;
	padding-top: 0px;
	text-align: left;
	height: 100%;
	min-width: 144px;

 
}

.service-bg{
background-color: #ffffff;


}

.left-side-menu{
	background-color: #CC3300;	
	
}


.sidetopbgx {
margin: 0;
padding-left: 0px;
background-color: #FF9900;
border-top-left-radius: 15px;
width: 100%;
text-align: center;

}


.itswhite {font-family: georgia, "times new roman"; font-size: 113%; color: #FFFFFF; font-weight: 500; text-align: left; margin-top: 0; margin-left: 5px;}

.itswhitex {font-family: georgia, "times new roman"; font-size: 125%; color: #FFFFFF; font-weight: 600; text-align: center; margin-top: 0; margin-bottom: 0; margin-left: 5px;}

.subwhite {font-family: georgia, "times new roman"; font-size: 75%; color: #FFFFFF; font-weight: 500; text-align: left; margin-left: 15px;}


.middle-content{

	padding: 0 10px 0 10px;
	margin-top: 0px;


	
}

h2.main_subject {font-family: "times new roman", verdana, arial; font-size: 18px; color: #000000; font-weight: 600; padding-top: 5px; margin-top: 0}



.right-side{

	text-align: center;
	height: 100%;
	min-width: 200px;
	display: block;

}




/* end new framework css */




/* new header css */

.how_tox {
font-family: verdana, arial, sans-serif;
color: #ff0000;
font-weight: 600;
/* font-size: 16px; */
clear: left;
margin: 2px 0 5px 0;
}

.blurbx {
font-family: "times new roman", verdana, arial, sans-serif;
color: #AA512A;
font-size: 88%;
font-weight: 600;
font-style: italic;
margin: 2px 0 0 0;
}



.topgrad {
    background-image: linear-gradient(to right, rgba(255,0,0,.2), rgba(255,102,0,.2), rgba(255,246,0,.2), rgba(0,255,0,.2), rgba(0,0,255,.2), rgba(255,0,255,.2));
    height: 78px;
    width: 100%;
    border-bottom: 2px outset #c0c0c0;

}

.header-container{
	max-width: 100%;
}

.favorl{
	float: left;
	text-align:center;
	width: 14.4%;
	

}

.favorl2{
	float: left;
	width: 60.6%;
	text-align:center;
	padding-top: 10px;

}


.main-logo{
	border-style: none;
	max-width: 100%;
	max-height: 100%;
	padding: 5px 5px 0 5px;
}

.fb-login{
	float:left;
	width: 25%;
	text-align: center;
	
}

.upper-mini-menu{
margin: 10px 0 12px 0;
	font-size: 58%;
}


.fb-login .fb-like{
	margin: 5px 0 0 0;
}

.break:before,
.break:after {
    content: "";
    display: table;
}

.break:after {
    clear: both;
}

.break {
    zoom: 1;
}




/* end new header css */



/* closing and menu base */

.menu-base{
clear: both;
padding: 5px;
border-top: 1px solid #cc3300;
border-bottom: 1px solid #cc3300;
text-align: center;
font-size: 62.5%;

}

.page-base{
	
color: #FF0000;
font-size: 70%;
text-align: center;
}




/* misc */

.top_description {
color: #000080;
font-weight: 600;
font-style: italic;
}


.about-author {
	
	border-top: 1px dashed #c0c0c0;
	font-weight: 600;
}


.to-index{
	font-size: 70%;
	font-family:Arial, Helvetica, sans-serif; 
}




/* not for mobile */

.hide-from-mobile{
	
	display: inline-block;
}


@media only screen and (max-width: 700px){

.hide-from-mobile{
	
	display: none;
}

.right-side{
	display: none;
}



}

@media only screen and (max-width: 400px){


.middle-container{
display: grid;
  grid-row-gap: 0px;
  grid-column-gap: 0px;
  /*justify-content: space-evenly;*/
  /*align-content: start;*/
  grid-template-areas: 'middle-content';

	
}