@charset "utf-8";

/* RESET CSS */
html,body,div,span,
pre,code,noscript,
strong,bold,br{margin:0;padding:0}
main,header,menu,nav,section,article,aside,figure,figcaption,details,footer{display:block;margin:0;padding:0}
p,h1,h2,h3,h4,h5,h6{line-height:1.2;margin:0;padding:0}
a,img,
ol,ul,li,
form,label,input,textarea,placeholder,button,
table,tr,th,td{text-decoration:none;outline:0;border:0;background:transparent;margin:0;padding:0}
placeholder{margin-left:6px}
/* --- END */

html {
	width: 100%; 
    height: 100%; 
	font-size: 62.5%; 
	-webkit-text-size-adjust: 100%; 
}
body  {
	width: 100%; 
	height: 101%;
    min-height: 101%;
	background-color: #FBFBF1; /* GULLIG */
}

/* DEFAULT ELEMENTS */
/* CONTAIN FLOATS - INDSÆT I PARENT */
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

/* HORIZ STREG */
hr  {
	width: 100%;
	height: 0;
	margin: 20px auto;
	border: 1px dotted #130D00;
}
/* TEXT LINE BREAK ON MOBILE */
span.text_break  {
/* SE JQQ */
	display: inline-block;
}

/* --------->  END OF DEFAULT ELEMENTS */


/* CORE PAGES - LOGO SYMBOLS - SE slider_med_info.css FOR FORSIDE LOGO*/
#wrap_logo_symbols {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%; 
}
img.logo_symbols {
	float: right;
	height: calc(100% - 60px - 80px);
	margin-top: 60px; 	
}
/* HVIS BREDERE END VIEWPORT */
@media only screen and (max-width : 510px) {
img.logo_symbols {
	height: auto; 	width: 100%;
}
}

/* ARTIST PAGE BG COLOR - CEHECKBOX  */
#artist_page_color {
	clear: both;
	display: table; /* 100% HEIGHT IFHT TIL CHILDREN */
	position: absolute;
	z-index: -999;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
/*	background: SE custom.js */
}

/* BF COLOR + LOGO SYMBOLS */
#page_height {
	clear: both;
	min-height: 100%;
	background-repeat: no-repeat;
		-webkit-transition: background-color 8s linear;
		-moz-transition: background-color 8s linear;
    transition: background-color 8s linear;
/* BG COLOR ANIM - SE nav.js */
}


/* MOBILE ELEMENTS + show / hide UNDER PRELOADER ANIMATION - SE head_artistpage_edit_bottom.php ----- */
.outer_wrap  {
	width: 100%;
	padding-left: 10px; padding-right: 10px;
}
/* -------- END OF MOBILE ELEMENTS  */


/* STRUKTURELLE ELEMENTER */
section {																			
}
section.edit_page {																
	padding: 10px 6px;
	margin: 0 auto;
	background-color: #F9F8EE; /* LYS GRÅ */
	border: 1px solid #313131;
	border-radius: 12px;
}
/* ARTIST NAME RESET BORDER LEFT */
section.edit_page:first-child {	
	border-left: 1px solid #313131;																	
	border-radius: 6px;
}
aside {																			
}
article {	
	padding: 6px; /* AFSTAND TIL INDHOLD - BLA SECTION PROFILE SOM ER PLACERET I SECTION INTRODUCTION  */
}
main  {
}
/* -------> END OF STRUKTURELLE ELEMENTS  */


/* LAYOUT ELEMENTER  */
/* MAX BREDDE 960PX */
.max_width  {
	width: 100%;
	max-width: 960px; 
	margin: 0 auto;
}
.max_width_500  {
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
}

/* MARGINS */
.top_60 {
	margin-top: 60px;
}
.top_120 {
	margin-top: 120px;
}
.top_50_padding {
	padding-top: 50px;
}
.top_60_padding {
	padding-top: 60px;
}
.bottom_10 {
	margin-bottom: 10px;
}
.bottom_30 {
	margin-bottom: 30px !important;
}
.bottom_120 {
	margin-bottom: 120px;
}

/* CENTER AN ELEMENT */
.center_this_element {
	position: absolute;
	z-index: 100;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

/* DEFAULT HØJDE + BREDDE TIL FRONT på BÅDE EDIT / ONLINE - SIDER ---------- */
.front,
.front_profile {
	display: inline-block; /* SECTION INTRODUCTION - EXPAND HEIGHT VED KLIK PÅ "REDIGER" PROFILE IMG NÅR info_text VISES  */
	width: 100%;  /* DEFAULT STYLING FOR ALLE FRONT WRAPPERE */
	height: auto; min-height: 180px; 	
	margin-bottom: 6px; /* AFSTAND TIL BUTTON show_form */
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid #313131;
	border-radius: 6px;
}
/* SECTION PROFILE */
.front_profile {
	min-height: 110px; /* RESET DEFAULT CLASS front*/
}
/* --------- END OF FRONT */


/* PRELOAD ANIMATION */
p.preload_text {
	display: none;         
    position: absolute;      
	z-index: 1001;   
    top: 50%;  left: 50%;                               
    transform: translate(-50%, -50%); 

	font-size: 22px;
	font-size: 2.2rem;
	font-weight: bold;
	line-height: 1.4;
    text-align: center;   
}

/* CIRKLERNE */
.turkis, .blue, .yellow, .orange, .red, .green {
	opacity: 0;
	position: absolute;
	width: 100px; height: 100px;
	border-radius: 100%;
}

/* START CSS ANIOMATION STRAKS - SE FUNCTION loader_anim_css I globals.js  */
#wrap_css_preloads {
	position: absolute;
	z-index: 1000;
    width: 100%; height: 100%;
	background: transparent;
}
/* CSS ANIM */
@keyframes fades {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; }
}
.start_1, .start_2, .start_3, .start_4, .start_5 {
    animation: fades 500ms;
    animation-timing-function: linear, ease-in;
}
/* PLACERINGER */
.start_1 {
    top: 12%;
	right: 22%;
}
.start_2 {
    animation-delay: 200ms;
    top: 64%;
	left: 14%;
}
.start_3 {
    animation-delay: 200ms;
    top: 28%;
	left: 48%;
} 
.start_4 {
    animation-delay: 200ms;
    bottom: 38%;
	right: 14%;
} 
.start_5 {
    animation-delay: 200ms;
    top: 12¤;
	left: 26%;
} 

/* JQ ANIMATION CIRCLES */
.preload_items {
	position: absolute; z-index: -1000; /* PLACER ANIM BAG INDHOLD - VIRKER PÅ PAGES OPRETTELSE - TJEK PÅ ARTSIT PAGES ????  */
}
		
/* COLORS */
.first_item_a  {
	background-color: #a4560a; /* ORANGE */
	border-radius: 100%;
}
.turkis  {
	background-color: #6f9991;
	border-radius: 100%;
}
.blue  {
	background-color: #3C6478;
	border-radius: 100%;
}
.yellow  {
	background-color: #BCA136;
	border-radius: 100%;
}
.orange  {
	background-color: #a4560a;
	border-radius: 100%;
}
.red  {
	background-color: #9A2617;
	border-radius: 100%;
}
.green  {
	background-color: #829356;
	border-radius: 100%;
}
.light_green  {
	background-color: #9ABB82;
	border-radius: 100%;
}
/* MOBILE LANDSCAPE */
@media (min-width: 320px) and (max-width: 480px) {
.first_item_a, .turkis, .blue, .yellow, .orange, .red, .green {
	width: 70px; height: 70px;
} 
}
/* MOBILE PORTRAIT  */
@media (min-width: 320px) and (max-width: 480px) {
.first_item_a, .turkis, .blue, .yellow, .orange, .red, .green {
	width: 70px; height: 70px;
}
}
/* ------->  END OF PRELOAD ANIMATION */


/* PAGE LOADER ANIMATION - ROUND SPINNER */
#page_load_anim  {
	display: none;
	position: fixed;
	top: 0; left: 0;
	z-index: 102; /* PALCER OVENPÅ error_text_wrap I ERROR MESSSAGES */
	width: 100%; height: 100%;
	background: rgba(255, 255, 255, 0.7);
}
.animate_background {
	position: absolute;
	z-index: 101;
	top: 0; bottom: 0;
	left: 0; right: 0;

    margin: auto;
    width: 200px;
    height: 200px;
    background-color: transparent;
	background-image: url(/images/icons/icon_anim_background.png);
	background-repeat: no-repeat;
	background-size: contain;
}
.animate_this {
	position: absolute;
	z-index: 100;
	top: 0; bottom: 0;
	left: 0;right: 0;

    margin: auto;
    width: 200px;
    height: 200px;
    background-color: transparent;
	background-image: url(/images/icons/icon_anim_page_load.png);
	background-repeat: no-repeat;
	background-size: contain;

    animation-name: spin;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes spin {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

/* -------> END OF PAGE LOADER ANIMATION */


/* SPAN TIL AJAX SUCCES */
span.ajax_errors {
	font-size: 0; /* SKJUL FX URL REDIRECTS FRA AJAX SUCCES */
}

/* MESSAGES */
.error_overlay {
	display: block;
	position: fixed; 
	z-index: 1002; /* PLACER PVENPÅ error_text_wrap - FREMVISERENS BUY ART FORM HAR INDEX 200 - SE wrap_kontakt_en_kunstner I images.css */
	top: 0; left: 0;
	width: 100%; height: 100%;
	padding: 0 10px;  /* AFSTAND TIL TEXT I MOBILE */ 
	background: rgba(255, 255, 255, 0.8);
}
.error_text_wrap {
	display: inline-block;
	position: relative;
	z-index: 1001;
	top: 50%; bottom: 50%; left: 50%; right: 50%;
	transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, 50%); /* IE9 SUPPORT ?? */
}
/* BESKEDEN */
p.error_text,
p.error_text > a {
	font-size: 22px;
	font-size: 2.2rem;
	line-height: 1.4;
	text-align: center;
}
p.error_text > a {
	color: #4A6D98;
}

/* TIL LIST VHA ERROOR MESSAGE - TEXT PÅ LIST - FX bekraeft-login-oplysninger.php */
.error_text_listed {
	position: relative;  /*PGA ABSOLUTE I span */
}
h1.h1_error_text_listed {
	text-align: center;
	color: #6B6B6B; /* MØRK GRÅ */
	font-size: 32px;
	font-size: 3.2rem;	
	line-height: 34px;
}
/* OVERSKRIFT */
h2.h2_error_text_listed {
	text-align: center;
	font-size: 26px;
	font-size: 2.6rem;
	line-height: 1.4;
}

/* OPLSYNINGER */
p.p_error_text_listed {
	text-align: center;
	font-size: 22px;
	font-size: 2.2rem;
	line-height: 1.4;
}

/* SOM CLASS BUTTON - SE styles.css */
button.error_close {
	display: block;
	width: 100%; 
	height: 30px;
	background-color: #F4F2E8; /* LYS CREME - CORE BUTTON COLOR */	
	border: 1px solid #313131;
	border-radius: 6px;
	cursor: pointer;
	text-align: center;
	
	line-height: 100%; 
	color: #313131;	/* MØRK GRÅ */	
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: bold;
}
.button_with_cancel {
	float: left;
	width: calc(100% - 30px - 10px); 
}

/* MOBILE */
@media only screen and (max-width : 510px) {
.error_text_wrap {
	max-width: 300px;
	word-break: break-word;
}
button.error_close {
    height: 48px;
	line-height: 44px; 

	font-size: 15px;
	font-size: 1.5rem;
} 
}
/* --------> END OF ERRORS */


/* BOGSTAV TÆLLERE */
.show_used_letters {
	float: left;
	width: 100%; 
	height: auto; /* EXPAND FØRST NÅR DER SKRIVES I input.data_input */
	padding-left: 8px; /* VERT ALIGN TIL TEXTAREA TEXT */
	
	line-height: 30px; /* HEIGHT AF TÆLLEREN */
	text-align: left;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: bold;	
}
/* -----> END OF BOGSTAV TÆLLERE */


/* OVERSKRIFTER TIL SECTIONS */
.section_info,
.section_info.checkbox_udstillingen_info { 
 	min-height: 30px; 
 	height: auto; /* SKAL KUNNE BLIVE HØJERE NÅR BESKRIVENDE TEXT RULLES NED VHA JQQQ  */
	margin-bottom: 4px; /* AFSTAND TIL class front - VIGTIGT! AFSTAND FRA "VIS / SKHJUL" BTN I SECTION DETAILS TIL FRONT */
}
/* CHECKBOX TIL UDSTILLINGEN UPLOAD */
.section_info.checkbox_udstillingen_info { 
	float: left;
}
.section_info > h4 { 
	float: left;
	margin-right: 10px;
	line-height: 30px; /* VERT ALIGN TEXT - SE fonts.css */
	color: #436A77; /* BLÅ */
	color: black;
	font-size: 15px;
}

/* ICON TIL TEXT INFO - SE custom.je FOR SHOW / HIDE */
.question_info_text { 
	float: left;
	height: 30px; width: 30px;
	background-color: #F4F2E8; /* SOM edit_button */
	background-image: url(/images/icons/icon_show_info.png); 
	background-position: center;
	background-size: 20px auto; 
	background-repeat: no-repeat;
	border-radius: 100%;
  	box-shadow: 0 0px 1px #888888 inset;
	
	cursor: pointer;
}
/* TEXT INFO WRAP */
.info_text { 
	display: none; /* VISES VHA JQQQQ */
	float: left;
	width: 100%;
	padding: 6px;
	margin-top: 6px;
	margin-bottom: 6px;
	background: #f8f9e2; /* GUL LYS */
	border: 1px solid #313131;
	border-radius: 6px;
}
.info_text h1 { 
	font-size: 17px;
	font-size: 1.7rem;
}
.info_text h2 { 
	font-size: 16px;
	font-size: 1.6rem;
}
.info_text > p,
.info_text > ul { 
	font-weight: normal; 
	color: #755021; /* MØRK BRUN - SKAL ANGIVES !!!!!!!!!!!!!!!!!  - ELLERS SKIFTES TIL LYS VED MØRK BG  */
}
.info_text > p > strong { 
	font-weight: bold; 
}
/* LISY PUNKTOPSTILLING */
ul.list_info_text { 
    list-style-type: none;
}
ul.list_info_text > li { 
	padding-left: 22px;	/* AFSTAND MELLEM IMG OG TEXT */
	margin-left: 10px; /* AFSTAND TIL UL */
	margin-bottom: 6px;	/* AFSTAND TIL NÆSTE LI */
	background-image: url(/images/icons/icon_checked.png);
	background-size: 18px 18px;
	background-position: left top;
	background-repeat: no-repeat;

	/* TEXT */
	color: #4c3723; /* BRUN SORT  */
	font-size: 15px;
	font-size: 1.5rem;		
}
ul.list_info_text > li:float { 
	margin-left: -6px; /* AFSTAND TIL UL */
}
/* LINKS */
ul.list_info_text > li a { 
	font-size: 15px;
	font-size: 1.5rem;		
}
/* ----> END OF OVERSKRIFTER */


/* SHOW / HIDE SECTIONS - KUN EDIT PAGE */
.wrap_show_hide_section { 
	position: relative; 
	height: 58px;
	width: 100%;
	padding-left: 10px;
	margin: 0 auto 30px auto;
/*	border-left: 6px solid #8DAE75;*/ /* GRØN */
	overflow: hidden;
}

.turkis  {
	background-color: #6f9991;
}
.blue  {
	background-color: #3C6478;
}
.yellow  {
	background-color: #BCA136;
}
.orange  {
	background-color: #a4560a;
}
.page_edit {
	border-left: 6px solid #9A2617; /* RØD */
}
.text_edit {
	border-left: 6px solid #6f9991; /* TURKIS  */
}
.image_edit {
	border-left: 6px solid #829356; /* MØRKERE GRØN */
}
.contact_edit {
	border-left: 6px solid #3C6478; /* BLÅ */
}
.light_green  {
	background-color: #9ABB82;
}

/* SHOW / HIDE SECTION */
.show_hide_section {
	position: absolute; 
    z-index: 101; /* OVENPÅ CHECKBOXES + CLICK - SE js  */
	top: 50%; bottom: 50%; 
	left: 50%; right: 50%; 
	transform: translate(-50%, -50%);
	height: inherit;
	width: 100%; 
	background-color: white;
	border: 1px solid #9F9E9E; /* LYS GRÅ */
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	
	cursor: pointer;
}
.show_hide_section > h2 {
	float: left;
	margin-left: 12px;
    color: #436A77;
    font-size: 20px;
	line-height: 50px; /* CENTER - SE wrap_show_hide_section */
	font-weigt: bold;
}

/* SHOW / HIDE */
button.button_show_hide_section {
	position: absolute; 
    z-index: 100; /* PLACER UNDER show_hide_section */
	top: 3px;
	right: 30px;
	height: 44px; min-width: 80px;
    padding: 0 10px;
	margin: 4px 0; /* CENTER */
    background-color: #f3f4dc; /* CREME */
    border: 1px solid grey;
    border-radius: 6px;
    text-align: center;

    color: #436A77;		
	font-size: 16px;
	font-size: 1.6rem;
	letter-spacing: 0.2rem;
    font-weight: bold;
}
@media only screen and (max-width : 510px) {
button.button_show_hide_section {
	right: 10px;
}
}
/* ----------> END OF SHOW / HIDE SECTIONS */


/* ARTIST NAVN - SE fonts FOR H1 */
section#section_artist_name {
	text-align: center;	
	margin-bottom: 12px; /* FATAND TIL img main */

	overflow: hidden; overflow-wrap: break-word; /* BREAK LANGE ORD */
}
/* ----------> END OF */



/* SECTION INTRODUCTION - WRAP */
				/* SKUB SECTION COMMENTS  - SE comments.css - NED TIL VERT SOM BUND AF PROFILE IMG */
				/*section#introduction { 
					min-height: calc(110px - 30px); 
				}*/
				/* SKIFT MOBILE BUTTONS - SE BREAKPOINTS I nav.js + nav.css + styles.css UNDER BUTTONS */
				/*@media only screen and (max-width : 5100px) {
				section#introduction { 
					min-height: calc(110px - 44px);
				}
				}*/


/* EDIT-PAGE - FRONT WRAP */
article#wrap_introduction {
/* HAR CLASS front_introduction */
	overflow: hidden; 
	overflow-wrap: break-word; /* BREAK LANGE ORD */
}
/* EDIT-PAGE - VERT ALIGN TEXT IFHT PROFILE IMG OVERSKRIFT */
.p_introduction_align {
	margin-top: 36px; 
}
p.introduction {
/* SE fonts.css */
}
/* ------------> END OF INTRODUCTION */


/* SECTION DETAILS */
article#wrap_details { 
/*	height: se custom.js */
	padding: 0; /* ALING VERT MED HEADING */
    overflow: hidden; word-wrap: break-word; /* SKJUL OG BREAK LANGE TEXT -ILNIER */
}

/* TEXT STYLING - SE fonts.css */

/* FORM - EDIT SECTION */
.wrap_form_details { 
	width: 100%; 
	height: auto;
	border-top: 2px solid white;
	border-radius: 6px;
}
/* FORM TIL UPLOAD */
form.form_details { 
	display: none;
	width: 100%; 
}
textarea.details_textarea { 
	/* height: SE custom.js */ 
}
/* SUBMIT DETAILS */
input.submit_details { 
	float: left;
	width: calc(100% - 10px - 30px); /* TRÆK FAST BREDDE AF input.submit_details + margin-right + button.cancel */
}
@media only screen and (max-width : 510px) {
input.submit_details { 
	float: left;
	width: calc(100% - 10px - 44px); 
}
}

/* "LÆS MERE" BUTTON */
button.read_more_details {
	display: none;  
	
	position: relative;
	top: -10px;
	width: 100%; 
	height: 40px;
	text-align: center;
	font-size: 1.8rem;
}

/* TEXT TIL ARTICLE + TINY MCE - SE fonts.css */

/* 	TINT MCE - IFRAME ALTID FULD HØJDE */
#tiny_mce_ifr { 
	min-height: 100%;
}
/* TINE MCE TEXT EDITOR - SKJUL LINK TIL TINY MCE*/
.tox-statusbar__branding {
	display: none;
}
/* ----------------- END OF SECTION DETAILS */ 


/* PAGE find-kunstnere.php */

.wrap_find_kunstner_bg_image { 
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
}

section#kunstnere { 
	background-color: transparent;
}
nav.kunstner_nav { 
	padding-top: 20px;
	border-top: 2px solid white;
	border-radius: 10px;
}
/* PHP ELEMENTER */
a.link_kunstner_page { 
	display: block;
	padding: 20px; 
	margin-bottom: 10px;
	background-color: #E7ECEE;
	border: 4px solid #DDDDDD;
	border-radius: 6px;
	line-height: 44px; 
	text-align: left;	

	transition: all 0.1s ease;
}
a.link_kunstner_page:hover { 
	background-color: #FFFFFF;
	border: 4px solid #AAAAAA;
}

ul.find_kunstner { 
	list-style-type: none;
}
li.navn_kunstner { 
	float: left;
	width: 100%;
	margin-bottom: 6px;
	border-radius: 6px;

	color: #313131;	/* MØRK GRÅ */
	font-size: 22px;
	font-size: 2.2rem;
}

li.beskrivelse_kunstner {
	color: #6B6B6B;	/* LYS GRÅ */
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.5;
	
	word-break: break-word; 
}
/* ----------------  END OF PAGE find-kunstnere.php  */