@charset="utf-8"

/** MIMETYPE="text/css" **/

/**

// thousandsuns.css <= ts.css
created by JvB on 2104-09-19 as part of the 2014 revamp 
of the ThousandSuns.org website.
2014-10-19 Changed name due to name conflicts with ts.css 
in Bootstrap.
**/

/*
07 Aug. 2016 
Every time I get this to work, it stops working within the year.
Problem seems to the file.css referencing a font.ttf residing in 
another directory, src: url("../font/Textile.ttf"), 
so moved the font here from the rsrc directory.
Added .textile class for good measure.
*/
	/**
	// Works with Firefox 33.0 or before for Mac:
	font-family: Textile;
	**/
	/**
	// Doesn't work with Firefox 33.0 or before for Mac,
	// works with Google Chrome:
	family-name: Textile;
	**/
/*
24 Aug. 2016 - Tired of conflicts with this and other @font calls. 
If need Textile font, use url(../../rsrc/Textile.ttf) 
*/
/*
17 Jan. 2021 - 
Browser CSS @font support improved over the years.
Format \ Edge  Chrome  F-fox  Safari  Opera
TTF/OTF   9.0*  4.0     3.5    3.1    10.0
WOFF      9.0   5.0     3.6    5.1    11.1
WOFF2    14.0  36.0    39.0   10.0    26.0
SVG        -     -       -     3.2      - 
EOT       6.0    -       -      -       - 
*/
@font-face
{
	font-family: Textile;
	font-style: normal ;
	font-weight: normal ;
	/*
	src: url("Textile.ttf") ; 
	*/
	src: local('Textile'), url(../font/Textile.ttf) ; 
}

.textile_font { font-family:Textile; } 

/* 2021-01-17 (JvB) Adding in a font with wide range of values. */
@font-face
{
	font-family: Unifont;
	font-style: normal ;
	font-weight: normal ;
	/*
	src: url("unifont-8.0.01.ttf") ; 
	*/
	/*
	src: local('Unifont'), url(../font/unifont-8.0.01.ttf) ; 
	Newest version added as of 05 June 2021 
	*/
	src: local('Unifont'), url(../font/unifont-13.0.06.ttf) ; 
	
}
.unifont_face { font-family:Unifont; } 

/* 
2021-06-22 (JvB) 
Narrow range, but great Lunar Phases & Earth hemispheres. 
...
2021-07-02 ... but first have to get a clean conversion to ttf from ttc ...
*/
/*
@font-face
{
	font-family: AppleColorEmoji;
	font-style: normal ;
	font-weight: 800 ;
	src: local(AppleColorEmoji), url(../font/AppleColorEmoji.woff) ; 
}
*/

body
{
	font-family: Garamond, Times, "Times New Roman", serif ;
	/**
	font-size: large ;
	background: #FFFFF0;
	text-align: center ; 
	**/
}

/* New 25 Apr. 2016 */
body, .tsyellow, .tsylw, .tspopup {
	background: #FFC;
}
.tspopup {
	border: 2px solid black;
	color: black ; 
}

section
{
	padding: 0px ; 
	/** Again, for pre-HTML5 browsers **/
	display: block;
}

header,
footer,
article,
aside,
nav
{
	padding: 10px ; 
	/** Again, for pre-HTML5 browsers **/
	display: block;
}

header,
footer,
figcaption
{
	text-align: center;
}

nav
{
	font-size: 1em ;
}

article,
p
{
	text-align: left ; 
	/**
	font-size: 2em ; 
	**/
}

.row
{
	padding: 5px 20px 5px 20px ;
}

.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9
{
	padding: 0px 10px 0px 10px ;
}

/**
Yellow: h:60° s:100% b:100%, rgb(255,255,0), #FFFF00, hsl(40,240,120)
**/
.yellow { color: #FFFF00 ; }

/**
Orange: h25° s100% b100%, rgb(255,106,0), #FF6A00, hsl(17,240,120) 
Orange: h25° s93% b99%, rgb(252,115,18), #FC7312, hsl(17,234,127) 
// New classes for text and element background 07 Aug. 2016
**/
.orange, .orange_ts { background-color: #FC7312 ; }
.orange_txt, .orange_txt_ts { color: #FC7312 ; }

.blue,
.ltblue
{
	/**
	hsb(190,93,99), rgb(18,218,252), #12D5FC
	**/
	color: #12D5FC ; 
}
.violet,
.magenta
{
	/**
	hsb(300,93,99), rgb(252,18,252), #FC12FC
	**/
	color: #FC12FC;
}
.indigo
{
	/**
	hsb(227,95,61)
	Indigo: h226&deg;s94%b53%, rgb(8,36,135), #082487, 
	        hsl(151,213,67)
	color: #082487; 
	**/
	/**
	Indigo: h226&deg;s94%b59%, rgb(9,43,150), #092B96, 
			hsl(,,)
	**/
	color: #092B96 ; 
}

.btnviblu
{
	color: #092B96 ; /* close to indigo ; */
	font-family: Textile, cursive ;
	background-image: url("../buttons/Btn_blank_088x055_viblu.jpg") ; 
	background-repeat: no-repeat ; 
	background-position: center ;
	/* close to magenta, hsb(300,93,99) */
	background-color: #FC12FC ; /*  */
	/* a hue of blue, hsb(190,93,99) 
	background-color: #12D5FC ; 
	Btn_blank_176x110_orylw.jpg
	*/
	width: 88px;
	height: 50px ; 
}

.ibtnorblu,
.btnorblu
{
	color: #082487 ; /* #092B96 close to indigo ; */
	font-family: Textile, cursive ; 
	font-size: 10pt ; 
	/* close to magenta, hsb(300,93,99) */
	background-color: #FC12FC ; /*  */
	/* a hue of blue, hsb(190,93,99) 
	background-color: #12D5FC ; 
	background-repeat: no-repeat ; 
	background-position: center ;
	*/
	width: 88px;
	height: 50px ; 
}
.btnorblu
{
	background-image: url("../buttons/Btn_blank_176x110_orylw.jpg") ; 
	background-repeat: no-repeat ; 
	background-position: center ;
	/* 
	*/
}
.ibtnorblu
{
	background-image: url("buttons/Btn_blank_176x110_orylw.jpg") ; 
	background-repeat: no-repeat ; 
	background-position: center ;
	/*
		
	*/
}

.btn
{
	border: 1px solid black ; 
	/**
	px or em
	box-shadow: hoffset voffset [blur-radius] spread-dist #000
	+ optional "inset" keyword for internal shadow
	**/ 
	box-shadow: 1em 1em 1em 1em #F4F4F4 inset  ; 
	border-radius: 1em ; 
	/**
	border-top-left-radius: 25% ; 
	border-top-right-radius: 25% ; 
	border-bottom-left-radius: 25% ; 
	border-bottom-right-radius: 25% ; 
	**/
}


.right
{
	text-align:right ; 
	/**
	align:right ; 
	**/
}


.left
{
	text-align:left ; 
	/**
	align:left ; 
	**/
}

canvas,
div canvas,
span canvas,
svg, 
div svg, 
span svg,
object, 
img,
image, 
figure
{
	text-align: center ; 
	margin-left: auto ; 
	margin-right: auto ;
	/**
	
	**/
}

header, 
footer
{
	min-width: 620px ; 
} 


/*
Added 07 Aug. 2017 to make use of new blank ThousandSuns radial gradient 
button, with yellow center (#ffff00) to orange rim (#fc731). This orange rim 
color has it's own classes, .orange[_ts] for backgrounds and 
.orange_txt[_ts] for text color.
*/
.ts_btn_bgnd, ts_bgnd_176x110, .ts_btn_bgnd_176x110, 
.ts_btn_bgnd_176wx110h, .ts_btn_bgnd_176w110h, .ts_btn_bgnd_w176, .ts_btn_bgnd_h110 
{
	background-image: url(Btn_blank_176x110_yw_or_fc7312_radial.png) ;
	background-repeat: no-repeat ; 
}
.ts_btn_bgnd_176wx110h, .ts_btn_bgnd_176w110h, .ts_btn_bgnd_w176 {
	width: 176px ; 
}
.ts_btn_bgnd_176wx110h, .ts_btn_bgnd_176w110h, .ts_btn_bgnd_h110 {
	height: 110px ; 
}