/*beginning of generic*/

.welcometype {
    color:yellow;
    font-size:1.5vw;
}
.scheduletype {
    color:black;
    font-size:1.5vw;
}

.msgitem {
color:gray;
font-size:1.5vw;

}
.msgitemgreen {
color:green;
font-size:1.5vw;
animation: p 2s linear infinite;

}


.editbox {
height:100%;
width:100%;
}

.datarow > div > p {
/*font-size:2vw;    */

}
.datarow {
font-size:6vw;    
border:1px solid #555;
border-radius: 3px;
padding: 3vw;
box-shadow:1vw 1vw 10vw 1vw #fff inset

}

#add {
border-radius:50%;
display:block;
float:right;
font-size:3em;
height:auto;
margin-right:2rem;
padding:1em;
text-align:center;
width:auto;
}

#productsum {
text-align:center;
}

.blue {
background:#3e5196;
}

.build {
background:blue;
border-radius:1vw;
display:block;
height:auto;
line-height:2.7vw;
margin:1vw auto;
padding:.5vw;
position:relative;
text-align:center;
width:12vw;
}

.build > a {
color:#fff;
font-size:2.7vw;
text-decoration:none;
}

.burger {
height:8vw;
position:absolute;
top: 1vw;
width:8vw;
z-index:1;
left:1vw;
display:none;
}

.dolla {
color:purple;
font-size:7vw;
margin:auto;
position:relative;
text-align:center;
top:.8vw;
}

.feature {
margin:auto;
width:100%;
height:100%;
}

.floatblock {
position:absolute;
border:1px solid #FFF;
border-radius:3vw;
box-shadow:1vw 1vw 1vw -1vw #844999 inset,1vw 1vw 1vw #555,-1vw -1vw 1vw #ddd;
height:auto;
    min-height: 38%;
margin:.5em;
padding:2.5vw;
width:63%;
left: 30vw;
top:2vw;


}

.green {
background:#4c963d;
}

.imageframe {
height:auto;
position:relative;
width:100%;
}

.lillogo {
background:url(../images/pony.png);
background-repeat:no-repeat;
background-size:100%;
color:transparent;
height:30vw;
width:30vw;
}

.lillogo > a {
display:block;
height:100%;
width:100%;
    z-index:1;
}

.logo {
background:url(../images/pony.png);
background-repeat:no-repeat;
background-size:100%;
color:transparent;
height:30vw;
width:30vw;
}

.navmenu {

position:relative;
left: 1vw;
width:28vw;
height: 100%;
display:inline-block;
}

.optiongroup {
display:inline-block;
height:auto;
padding:1vw;
}

.orange {
background:#f17633;
}

.pink {
background:#FFC0CB;
border-radius:50%;
display:inline-block;
height:1em;
margin:.5em .50em 0em 0em;
width:1em;
}

.pip {
border-radius:50%;
display:inline-block;
height:1em;
margin:0em .5em;
position:relative;
top:.25em;
width:1em;
}

.placeholder {
display:block;
text-align:center;
    position:relative;
    width:auto;
    height:auto;
    left:0;
}


.price {
align-items:justify;
background:#FFC0CB;
border-radius:50%;
display:inline-block;
height:15vw;
margin:1vw;
position:relative;
text-align:center;
width:15vw;
}

.productinfo {
background:#fff;
border:2px solid gray;
font-size:.5rem;
margin:1.5rem auto;
padding:1.5rem;
width:95vw;
}

.producttitle {
color:#4D2286;
font-size:2vw;
margin:auto;
}

.pulsating-circle {
}

.non-pulsating-circle {
/*box-sizing:border-box;
display:block;
content:'';
border-radius:16vw;
background:#844999;
height:16vw;
left:-3vw;
position:absolute;
top:-3vw;
width:16vw;
*/
}



.purple {
background:#844999;
}

.red {
background:#f13333;
}

.sampledisplay {
border:1px solid #000;
display:inline-block;
height:40vw;
margin:2vw 1vw 1vw;
padding:1vw;
width:20vw;
}

.sectionbutton {
animation-duration:4s;
animation-name:wower;
background:repeating-radial-gradient(red,#ff0 10%,green 15%);
border:.1vw solid #8078a9;
border-radius:50%;
color:#000;
display:inline-block;
float:left;
font-size:5vw;
height:35vw;
margin:4vw 5.2vw 5vw;
padding:2vw;
position:relative;
text-align:center;
width:35vw;
}

.sectionbutton > a {
display:inline-block;
margin-top:13vw;
text-align:center;
text-decoration:none;
}

.sectionbutton > a > span {
color:red;
font-size:2vw;
}

.sectionbutton:hover {
animation-duration:2s;
animation-name:wower;
}

.smallprint {
color:#000;
font-size:.75em;
}

.thesist {
font-family:sofadi_oneregular,sans-serif;
}

.titlebar {
background:#06523f;
font-size:7vw;
height:auto;
margin:0;
padding:2vw;
text-align:center;
text-shadow:.05em .05em .1em #520619;
width:auto;
    display:none;
}

.titlebar > a {
color:#8078a9;
text-decoration:none;
}

.yellow {
background:#f2b934;
}

@font-face {
font-family:sofadi_oneregular;
font-style:normal;
font-weight:400;
src:url(./fonts/sofadione-regular-webfont.eot?#iefix) format('embedded-opentype'),url(./fonts/sofadione-regular-webfont.woff2) format('woff2'),url(./fonts/sofadione-regular-webfont.woff) format('woff'),url(./fonts/sofadione-regular-webfont.ttf) format('truetype'),url(./fonts/sofadione-regular-webfont.svg#sofadi_oneregular) format('svg');
}

body {
font-family:sans-serif;
font-size:100%;
height:auto;
margin:0;
min-width:280px;
width:100vw;
}

footer {
display:block;
color:#6B6A6A;
font-family:sofadi_oneregular,sans-serif;
font-size:2vw;
height:100%;
margin:auto;
padding-left:2vw;
position:relative;
text-shadow:.02em .02em #fff;
width:auto;

}

.bug {
display:block;
color:#6B6A6A;
font-family:sofadi_oneregular,sans-serif;
font-size:2vw;
height:100%;
margin:auto;
padding-left:2vw;
position:relative;
text-shadow:.02em .02em #fff;
width:auto;
    /*color:#6B6A6A;
font-family:sofadi_oneregular,sans-serif;
font-size:3vw;
height:100%;
margin:0 0 3vw 0;
padding-bottom:1vw;
padding-left:5vw;
position:relative;
text-shadow:.02em .02em #fff;
width:auto;
    line-height:.5vw;*/
}
h1 {
color:#4D2286;
font-size:3vw;
margin:auto;
text-align:center;
text-shadow:.1vw .1vw #776EA3;
width:auto;

}

h2 {
color:#A52A2A;
font-size:2vw;
margin:auto;
text-align:center;
text-shadow:.05vw .05vw #776EA3;
width:auto;
}

hr {
visibility:hidden;
}

label {
font-size:1.5rem;
line-height:2rem;
}

li {
background:#D13200;
border-radius:1.5vw;
display:block;
/*float:left;*/
font-size:2vw;
margin-bottom:7%;
text-align:center;
text-shadow:.05em .05em #06523f;
transition:background-color 150ms,border 150ms;
width:auto;
    padding:1vw;
}

li > a {
background:url(/images/shiner.png)
background-repeat:no-repeat;
background-size:100%;
color:#D2B48C;
display:block;
height:100%;
text-decoration:none;
width:auto;
}

li > img {
display:block;
height:100%;
width:100%;
}
/*
li:hover {
background:#fff;
border:1px solid #8078a9;
transition:background-color 150ms,border 150ms;
}
*/

p {
color:#000;
font-size:2vw;
}

table,th,td {
border:1px solid #000;
border-collapse:collapse;
}

td {
text-align:center;
width:6vw;
}

ul {
background:#fff;
border:1px solid #8078a9;
border-radius:2.5vw;
list-style-type:none;
margin:0;
opacity:1;
overflow:hidden;
padding:5% 5% 0 5%;
visibility:visible;
display:block;
}

 @keyframes p {
      0%, 50%, 90% { opacity: 1 }
      25%, 75%, 100% { opacity: 0 }
    }

@keyframes woower {
0%,100% {
opacity:100%;
}

50% {
opacity:0%;
}
}

@keyframes wower {
0% {
rotate:0 0 1 0deg;
}

100% {
rotate:0 0 1 360deg;
}
}

@keyframes woobsy {
0% {
rotate:0 0 1 0deg;
}

100% {
rotate:0 0 1 360deg;
}
}

@keyframes pulse-ring {
0% {
transform:scale(0.33);
}

80%,100% {
opacity:0;
}
}

@keyframes pulse-dot {
0% {
transform:scale(0.8);
}

100% {
transform:scale(0.8);
}

50% {
transform:scale(1);
}
}


.tablebody {
margin-top:1vw;
}


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


.msgitem {
color:gray;
font-size:3vw;


}


.editbox {
height:100%;
width:100%;
}

.datarow > div > p {
font-size:6vw;    

}
.datarow {
font-size:6vw;    
border:2px solid white;
border-radius: 5px;
padding: 3vw;
box-shadow:1vw 1vw 10vw 1vw #fff inset

}

#add {
border-radius:50%;
display:block;
float:right;
font-size:3em;
height:auto;
margin-right:2rem;
padding:1em;
text-align:center;
width:auto;
}

#productsum {
text-align:center;
}

.blue {
background:#3e5196;
}

.build {
background:blue;
border-radius:1vw;
display:block;
height:auto;
line-height:2.7vw;
margin:1vw auto;
padding:.5vw;
position:relative;
text-align:center;
width:12vw;
}

.build > a {
color:#fff;
font-size:2.7vw;
text-decoration:none;
}

.burger {
height:8vw;
position:absolute;
top: 1vw;
width:8vw;
left:1vw;
display:block;
z-index:1;
    pointer-events:none;
}

.dolla {
color:purple;
font-size:7vw;
margin:auto;
position:relative;
text-align:center;
top:.8vw;
}

.feature {
margin:auto;
width:100%;
height:100%;
}

.floatblock {
    position:relative;
border:1px solid #FFF;
border-radius:5vw;
box-shadow:1vw 1vw 10vw -1vw #844999 inset,2vw 2vw 10vw #555,-2vw -2vw 2vw 5vw #EEE;
height:100%;
margin:.5em;
padding:2.5vw;
width:auto;
left: auto;
    top:auto
}

.green {
background:#4c963d;
}

.imageframe {
height:auto;
position:relative;
width:100%;
}

.lillogo {
background:url(../images/hs.png);
background-repeat:no-repeat;
background-size:auto 100%;
height:20vw;
margin-bottom:7vw;
margin-left:22vw;
width:auto;
}

.lillogo > a {
display:block;
height:100%;
width:100%;
    z-index:1;
}

.logo {
background:url(../images/pony.png);
background-repeat:no-repeat;
background-size:100%;
color:transparent;
height:100vw;
width:100vw;
}

.navmenu {
left:5vw;
position:absolute;
top:5vw;
width:90vw;
height: 0;
z-index: 1;

}

.optiongroup {
display:inline-block;
height:auto;
padding:1vw;
}

.orange {
background:#f17633;
}

.pink {
background:#FFC0CB;
border-radius:50%;
display:inline-block;
height:1em;
margin:.5em .50em 0em 0em;
width:1em;
}

.pip {
border-radius:50%;
display:inline-block;
height:1em;
margin:0em .5em;
position:relative;
top:.25em;
width:1em;
}

.placeholder {
display:block;
text-align:center;
}

.placeholder:hover > ul,.placeholder:active > ul {
left:5vw;
top:15vw;
opacity:1;
position:relative;
transition:opacity 250ms;
visibility:visible;
width:85vw;
z-index:1;
}

.price {
align-items:justify;
background:#FFC0CB;
border-radius:50%;
display:inline-block;
height:15vw;
margin:1vw;
position:relative;
text-align:center;
width:15vw;
}

.productinfo {
background:#fff;
border:2px solid gray;
font-size:.5rem;
margin:1.5rem auto;
padding:1.5rem;
width:95vw;
}

.producttitle {
color:#4D2286;
font-size:2vw;
margin:auto;
}

.pulsating-circle {
height:20vw;
left:-5vw;
position:absolute;
top:-5vw;
width:20vw;
}

.pulsating-circle:after {
animation:pulse-dot 1.25s cubic-bezier(0.455,0.03,0.515,0.955) -0.4s infinite;
background:#844999;
border-radius:20vw;
content:'';
display:block;
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
}

.pulsating-circle:before {
animation:pulse-ring 1.25s cubic-bezier(0.215,0.61,0.355,1) infinite;
background:#f13333;
border-radius:150%;
box-sizing:border-box;
content:'';
display:block;
height:150%;
margin-left:-25%;
margin-top:-25%;
position:absolute;
width:150%;
}

.non-pulsating-circle {
box-sizing:border-box;
display:block;
content:'';
border-radius:16vw;
background:#844999;
height:16vw;
left:-3vw;
position:absolute;
top:-3vw;
width:16vw;

}



.purple {
background:#844999;
}

.red {
background:#f13333;
}

.sampledisplay {
border:1px solid #000;
display:inline-block;
height:40vw;
margin:2vw 1vw 1vw;
padding:1vw;
width:20vw;
}

.sectionbutton {
animation-duration:4s;
animation-name:wower;
background:repeating-radial-gradient(red,#ff0 10%,green 15%);
border:.1vw solid #8078a9;
border-radius:50%;
color:#000;
display:inline-block;
float:left;
font-size:5vw;
height:35vw;
margin:4vw 5.2vw 5vw;
padding:2vw;
position:relative;
text-align:center;
width:35vw;
}

.sectionbutton > a {
display:inline-block;
margin-top:13vw;
text-align:center;
text-decoration:none;
}

.sectionbutton > a > span {
color:red;
font-size:2vw;
}

.sectionbutton:hover {
animation-duration:2s;
animation-name:wower;
}

.smallprint {
color:#000;
font-size:.75em;
}

.thesist {
font-family:sofadi_oneregular,sans-serif;
}

.titlebar {
background:#06523f;
font-size:7vw;
height:auto;
margin:0;
padding:2vw;
text-align:center;
text-shadow:.05em .05em .1em #520619;
width:auto;
    display:none;
}

.titlebar > a {
color:#8078a9;
text-decoration:none;
}

.yellow {
background:#f2b934;
}

body {
font-family:sans-serif;
font-size:100%;
height:auto;
margin:0;
min-width:280px;
width:100vw;
}

footer {
color:#6B6A6A;
font-family:sofadi_oneregular,sans-serif;
font-size:3vw;
height:100%;
margin:auto;
padding-left:5vw;
position:relative;
text-shadow:.02em .02em #fff;
width:auto;
    line-height:.5vw;
}

.bug {
color:#6B6A6A;
font-family:sofadi_oneregular,sans-serif;
font-size:3vw;
height:100%;
margin:0 0 3vw 0;
/*padding-bottom:1vw;*/
padding-left:5vw;
position:relative;
text-shadow:.02em .02em #fff;
width:auto;
    line-height:.5vw;
}
h1 {
color:#4D2286;
font-size:5vw;
margin:auto;
text-align:center;
text-shadow:.25vw .25vw #776EA3;
width:auto;

}

h2 {
color:#A52A2A;
font-size:3vw;
margin:auto;
text-align:center;
text-shadow:.1vw .1vw #776EA3;
width:auto;
}

hr {
visibility:hidden;
}

label {
font-size:1.5rem;
line-height:2rem;
}

li {
background:#D13200;
border-radius:2.5vw;
display:block;
float:left;
font-size:5vw;
height:7vw;
line-height:7vw;
margin:2vw;
text-align:center;
text-shadow:.05em .05em #06523f;
transition:background-color 150ms,border 150ms;
width:80vw;
}

li > a {
background:url(/images/shiner.png)
background-repeat:no-repeat;
background-size:100%;
color:#D2B48C;
display:block;
height:100%;
text-decoration:none;
width:100%;
}

li > img {
display:block;
height:100%;
width:100%;
}
/*
li:hover {
background:#fff;
border:1px solid #8078a9;
transition:background-color 150ms,border 150ms;
}
*/

p {
color:#000;
font-size:3vw;
}

table,th,td {
border:1px solid #000;
border-collapse:collapse;
}

td {
text-align:center;
width:6vw;
}

ul {
background:#fff;
border:1px solid #8078a9;
border-radius:5vw;
list-style-type:none;
margin:0;
opacity:0;
overflow:hidden;
padding:0;
visibility:hidden;
}


.tablebody {
margin-top:1vw;
}

}