/*Styling for the entire page,
can set bg images here*/

html {
    background-image: url("/dollmaker/assets/bg.png");
    background-color: #f1b8d0; 
    background-repeat: repeat-y /* Set to repeat if using a tiled background */
    scrollbar-color: #6c6d47 #A068FF; /* Fancy scrollbar stylings */
}

/*default text color*/

body {
    color: #0d1826;
}

/* Use custom fonts for stuff that you wanna use it for */
h1,h2, button, #page-header a,#page-subheader a {
    font-family: 'Helvetica', sans-serif;
}


/*TITLE*/

#page-header {
    color: #0d1826;
}

/*BELOWTITLE*/
#page-subheader {
    color: #ae456d;
}

#page-subheader a {
    color: #ae456d;
    transition: 0.3s;
}

#page-subheader a:hover {
    color: #ae456d;
}

button {
    color: #ae456d;
    background-color: #f1b8d0;
    outline: 0px solid #ae456d;
    border: 0;
}

/* Button hover styling */
button:hover {
    background-color: #EEF2EA;
    color: #ae456d; 
    border: 0;
    cursor
}

/* This specifies styles that will affect all the boxes. Change to your own colors!*/
#bodyArea,#swatchesArea,.ui-tabs-panel {
    outline: 4px solid #ae456d; /* Switched border with outline, to prevent offset issues on mobile */
    outline-style: double;
    background: #EEF2EA;
}

#swatchesArea a {
}

#swatchesArea a:hover {
	outline: 1px solid #EEF2EA;
}

#tabsbar text {
 }

#tabsbar li a {
   border: 4px solid #ae456d;
   
  border-style:double;
   border-bottom: 4px solid #EEF2EA;
   background-color: #F1B8D0;
   color: #ae456d;
}

/* Tabs hover styling, only for unselected tabs */
#tabsbar .ui-state-default a:hover {
    border-bottom: 3px solid #EEF2EA;
    background-color: #EEF2EA;
}

#tabsbar .ui-state-active a,#tabsbar .ui-state-active a:hover {
    border-bottom: 3px solid #EEF2EA;
    background-color: #EEF2EA;
}