@charset "utf-8";
/* CSS Document 
margin and padding is:  top, right, bottom, left */


a {
	font-size:inherit;
}


a:link {
    font-family: verdana, geneva, tahoma, sans-serif;
    font-size:inherit;
    font-weight: 600;
	text-decoration: none; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
    font-family: verdana, geneva, tahoma, sans-serif;
	text-decoration: none;
}
a:hover {
    font-family: verdana, geneva, tahoma, sans-serif;
    font-size:inherit;
    font-weight: 700;
	text-decoration: none;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
    font-family: verdana, geneva, tahoma, sans-serif;
    font-size:inherit;
	text-decoration: none;
}


p a:link {
	color:#f253a2;
    font-size:inherit;
    font-weight:500;
    text-decoration: none;
}
p a:hover {
	background-color:#eee;
}
p a:visited {
    color:#ed95cf;
    text-decoration: none;
}


* {
	font-family: verdana, geneva, tahoma, sans-serif;
	color: black;
}

@media (max-width:420px) {
    *{
    font-size: 10px;
    }    
    a:link, a:visited, a:hover {
    font-size: 10px;
    }
}

@media (min-width: 421px) and (max-width:619px) {
    *{
    font-size: 11px;
    }    
    a:link, a:visited, a:hover {
    font-size: 11px;
    }
}

@media (min-width:620px) and (max-width:992px) {
    * {
    font-size:14px;
    }    
    a:link, a:visited, a:hover {
    font-size:14px;
    }
}

@media (min-width:993px) and (max-width:1200px) {
    * {
    font-size: 14px;
    }    
    a:link, a:visited, a:hover {
    font-size: 14px;
    }
}

@media (min-width:1201px) {
    * {
    font-size: 16px;
    }    
    a:link, a:visited, a:hover {
    font-size: 16px;
    }
}

b {
    font-family: inherit;
    font-size: inherit;
}

i {
    font-family: inherit;
    font-size: inherit;
}

li {
	font-size: .9rem;
	line-height: 130%;
    padding: 0rem .8rem .3rem .8rem;
    list-style-type: none;
    margin-bottom:.4rem;
}

li a {
    font-size: 1rem;
}

p {
	font-size: .9rem;
	line-height: 140%;
    margin-top:.3rem;
    padding: .2rem .6rem .2rem .8rem;
	border-left: .1rem dashed #000; 
	border-right: .1rem dashed #000;
}

strong {
    font-size:inherit;
}


ul {
    font-size: .9rem;
	line-height:150%;
	border-left: .05rem dashed #000; 
	border-right: .05rem dashed #000;
}


h1, h2, h3, h4, h5, h6 {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
}

h1 {
	font-size: 1.3rem;
    margin-bottom: 1.5rem;
    padding: .04rem .7rem .04rem .7rem;
	border-left: .35rem dashed #000; 
	border-right: .35rem dashed #000;	
	/* border-left: .2rem dashed #000; 
	border-right: .2rem dashed #000; */
}

.cycle-title h1 {
	border: none;
	margin-bottom:0;
	font-size:inherit;
}

h1 {
	font-size: 1.4rem;
    margin-bottom: .5rem;
    padding: .04rem .7rem .04rem .7rem;
	border-left: .3rem dashed #000; 
	border-right: .3rem dashed #000;
}

h2 {
	font-size: 1.2rem;
    margin-bottom: .5rem;
    padding: .04rem .7rem .04rem .7rem;
	border-left: .3rem dashed #000; 
	border-right: .3rem dashed #000;
}

h4 {
	font-size: 1rem;
	margin-bottom: .05rem;
    padding: .8rem 0rem 0rem .6rem;
    padding-bottom: -.8;
	border-left: .2rem dashed #000; 
	border-right: .2rem dashed #000;
}

h5 {
	font-size: .80rem;
	font-weight:700;
	margin-bottom: .02rem;
    padding: .5rem .6rem 0rem .6rem;
	border-left: .1rem dashed #000; 
	border-right: .1rem dashed #000;
}

h6 {
	font-size: .65rem;
	margin-bottom: .02rem;
    padding: .04rem .7rem .04rem .7rem;
    border-left: .1rem dashed #000; 
	border-right: .1rem dashed #000;
}

@media (max-width:838px) {
    h1 { font-size:1.1rem;}
    h2 { font-size:1.1rem;}
    h3 { font-size:1.1rem;}
    h4 { font-size:.9rem;}
    h5 { font-size:.75rem;}
    h6 { font-size:.55rem;}
}


.theory-share-track {
    border-left: .1rem dashed #000; 
	border-right: .1rem dashed #000;
	display:flex;
    justify-content:flex-end;
    padding: .2rem .6rem .2rem .8rem;
    width:100%;
}

.writ {
    background-color: #d9ffff;
    border: 2px solid black;
    border-radius: 10px;
	color: #000;
	box-shadow:2px 4px 4px #000;
	height:auto;
    margin:auto;
    margin-top:8px;
    margin-bottom: 22px;
	padding: 20px 12px 28px 12px;
	width: 90%;
}

.writ p {
	font-size: .9rem;
	line-height: 150%;
    margin-top:.3rem;
    padding: .2rem .6rem .2rem .8rem;
	border-left: .1rem dashed #000; 
	border-right: .1rem dashed #000;
}


.writ-large {
    background-color: #d9ffff;
    border: 2px solid black;
    border-radius: 10px;
	color: #000;
	box-shadow:2px 4px 4px #000;
	height:auto;
    margin:auto;
	padding: 4px 12px 12px 12px;
	width: 98%;
}

.writ-large h4 {
    border-color: #A5C2CC;
}

.writ-amazon-right{
    background-color:cadetblue;
    clear:both;
    display:flex;
    flex-direction: column;
    float:right;
    height:auto;
    width:240px;
}

.writ-amazon-left{
    background-color:cadetblue;
    clear:both;
    display:flex;
    flex-direction: column;
    float:left;
    height:auto;
    width:240px; 
}

.writ-amazon-title {
    font-size:.7rem;
}

.writ-amazon-caro {
    background-color:beige;
}