.cg14L { font-family : Century Gothic; color : #000000; font-size : 14px; text-align : left } 
.cg12L { font-family : Century Gothic; color : #000000; font-size : 12px; text-align : left } 
.cg10L { font-family : Century Gothic; color : #000000; font-size : 10px; text-align : left } 
.cg8L { font-family : Century Gothic; color : #000000; font-size : 8px; text-align : left } 
.cg14CB { font-family : Century Gothic; color : #000000; font-size : 14pt; font-weight : bold; text-align : center; margin-bottom : 0; margin-top : 0; } 
.cg16CB { font-family : Century Gothic; color : #000000; font-size : 16pt; font-weight : bold; text-align : center; margin-bottom : 0; margin-top : 0; } 
.cg14C { font-family : Century Gothic; color : #000000; font-size : 14pt; font-weight : normal; text-align : center; margin-bottom : 0; margin-top : 0; }
.cg10R { font-family : Century Gothic; color : #000000; font-size : 10px; text-align : right; margin-bottom : 0; margin-top : 0;  } 
.cg12R { font-family : Century Gothic; color : #000000; font-size : 12px; text-align : right; margin-bottom : 0; margin-top : 0;  } 
.cg14R { font-family : Century Gothic; color : #000000; font-size : 14px; text-align : right; margin-bottom : 0; margin-top : 0;  } 
.cg14C { font-family : Century Gothic; color : #000000; font-size : 14px; text-align : center; margin-bottom : 0; margin-top : 0;  } 
body { font-family : LofiCottage-Regular; margin : 0; padding : 0; background-color : #ffffff; text-align : center;font-variant-ligatures: none;}

table { font-variant-ligatures: none;color: #4b4c4e;}
/* this prevents bootstrap from adding URL's and Hyperlinks from showing when you Ctrl-P */
@media print {
  a[href]:after {
    content:none;
    }
  }

.patternsh1 { font-family : Century Gothic; color : #000000; font-size : 14pt; font-weight : bold; text-align : center; margin-bottom : 0; text-decoration : underline; } 
.patternsh2 { font-family : Century Gothic; color : #000000; font-size : 14pt; text-align : center; } 
.patternsh3 { font-family : Century Gothic; font-weight : 400; color : #000000; font-size : 10pt; text-align : center; } 
.patternsh4 { font-family : Century Gothic; color : #000000; font-size : 10pt; font-weight : bold; text-align : center; line-height : 100%; } 
.patternsh5 { font-family : Century Gothic; color : #000000; font-size : 12pt; font-weight : normal; text-align : center; } 
.patternsh6 { font-family : Century Gothic; color : #666666; font-size : 8pt; text-align : center; } 


.yarndesc {
   font-family: Century Gothic;
   font-size: 10px;
}
.yarnsh1 {
   font-family: Century Gothic;
   font-size: 24px; text-align: right;
}
.yarnsh1pink {
   font-family: lofi cottage;
   font-size: 24px; text-align: right;
   color: #4B4C4E;

}
.yarnsh2 {
   font-family: Century Gothic;
   font-size: 14px; text-align: right;
}
.yarnsh2 {
   font-family: Century Gothic;
   font-size: 14px; text-align: right;
}
.yarnsh3 {
   font-family: Century Gothic;
   font-size: 10px; text-align: center;
}
.yarnsh4 {
   font-family: Century Gothic;
   font-size: 14px; text-align: left;
}
.yarndisc {
   font-family: Century Gothic;
   font-size: 12pt; text-align: right;
    color: #FF3399;
}
.tboxed {
    border: 1px solid #000000;
    text-align:center;
}
.boxed {
    color : black;    
}
a:hover.boxed {
    color : red;
}
a:link.boxed {
    text-align:center;
    text-decoration: none;
}
a:visited.boxed {
    text-align:center;
    text-decoration: none;
}
a:link.active {
    text-align:center;
    text-decoration: none;
}
#main-navigation {
  position:relative;
  z-index: 1000;
  }
  
#main-navigation li {
  float: left;
  list-style-type: none;
  }

#main-navigation li ul li {
  float: none;
  text-style-type: none;
  text-align: left;
  line-height: 4px;
    }

ul {
  list-style: none;
  padding: 0;
  margin: 0;
  background: #ffffff;
   font-family: LofiCottage-Regular;
   font-size: 14px; padding-left:0px; padding-right:0px; padding-top:0px; padding-bottom:0px
}

ul li {
  display: block;
  position: relative;
  float: left;
}

/* This hides the dropdowns */
li ul { display: none; }

ul li a {
  display: block;
  padding: 1em;
  text-decoration: none;
  white-space: nowrap;
  color: #000000;
}

ul li a:hover { background: #ffffff; 
color: #B7DBD4;}

/* Display the dropdown */
li:hover > ul {
  display: block;
  position: absolute;
}

li:hover li { float: none; }

li:hover a { background: #ffffff; }

li:hover li a:hover { background: #ffffff; }

/* Displays second level dropdowns to the right of the first level dropdown */
ul ul ul {
  left: 100%;
  top: 0;
}

/* Simple clearfix */
ul:after { clear: both; }

#container {
    width: 100%;
    max-width: 1050px;
    margin: 0px auto;
    border: 0px solid black;
    padding: 0px;
}
#container .row {
    border: 0px solid green;
    border-left: 0;
    border-top: none;
    margin: 0;
    padding: 0;
}
#container br {
    clear: both;
}
#container .block {
    border: 0x;
    border-bottom: 0;
    border-right: 0;
    min-width: 175px;
    min-height: 225px;
    float: left;

}
.rotate90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

/* Hover over function used to show swatches */

#thumbwrap {
	margin:10px auto;
	width:600px; height:20px;
}
.thumb {
	float:center; /* must be floated for same cross browser position of larger image */
	position:relative;
	margin:3px;
}
.thumb img { 
	border:0px solid #000;
	vertical-align:top;
}
:hover.thumb {
	border:0; /* IE6 needs this to show large image */
	z-index:1;
}
.thumb span { 
	position:absolute;
	visibility:hidden;
}
:hover.thumb span { 
	visibility:visible;
	position absolute;
	top:-300px; left:1px; 
}
@media print {
    .tit {
       color: red !important ;
    }
}

/*
Font: 		Lofi Cottage
Style: 		Regular
URL: 		https://www.youworkforthem.com/font/T11672/lofi-cottage
Foundry: 	Craft Supply Co.
Foundry: 	https://www.youworkforthem.com/designer/1083/craft-supply-co
Copyright:	Copyright (c) 2019 by Craft Supply Co. All rights reserved.
Version: 	17
Created:	December 16, 2019
License: 	https://www.youworkforthem.com/font-license 
License: 	The WebFont(s) listed in this document must follow the YouWorkForThem
			WebFont license rules. All other parties are strictly restricted 
			from using the WebFonts(s) listed without a purchased license. 
			All details above must always remain unaltered and visible in your CSS.
*/

@font-face {
	font-family: 'LofiCottage-Regular';
	src: url('lofi-cottage.eot');
	src: url('lofi-cottage.eot?#iefix') format('embedded-opentype'),
             url('lofi-cottage.woff2') format('woff2'),
	     url('lofi-cottage.woff') format('woff'),
	     url('lofi-cottage.ttf') format('truetype'),
	     url('lofi-cottage.svg#youworkforthem') format('svg');
	font-weight: normal;
	}
.lofi { font-family: 'LofiCottage-Regular';}

.lofii { font-family: 'LofiCottage-Regular'; font-style: italic;}

.select-css option {
    font-family:'LofiCottage-Regular';
    font-variant-ligatures: none;
}
#float{
  position:fixed;
  width:125px;
  height:75px;
  top:400px;
  left:000px;
  border-style:solid;
  border-radius:30px;
  text-align:center;
  Padding:5px;
  box-shadow: 2px,2px 3px #999;
  clear: both;
  }