
/*--------------------------------------------------------------
	Layout
--------------------------------------------------------------*/

html,
body {
	background-color: #fff;
}

.light {
	background-color: #fff;
}

.light.yellow {
	background-color: #F6C52F;
}

.lighter {
	background-color: #F0F0F0;
}

.dark {
	background-color: #333;
}

.darker {
	background-color: #4A4A4A;
}

.darker.green {
	background-color: #98bf18;
}

.darker.red {
	background-color: #9d1720;
}

.darker.yellow {
	background-color: #F6C52F;
}

.darker.blue {
	background-color: #8CBCCA;
}


/* bör matcha färgen på footer, ifall sidan har lite innehåll så att bakgrundsfärgen går ihop med footer */
main {
	background-color: transparent;
}

/*--------------------------------------------------------------
	Theme typography
--------------------------------------------------------------*/


a,
a:visited {
	color: #000;
}

a:hover,
a:active,
a:focus {
	color: #aaa;
}

/* Länkfärg mot mörk bakgrund */
.dark a,
.dark a:visited,
.darker a,
.darker a:visited {
	color: #FFF;
}

.dark a:hover,
.dark a:active,
.dark a:focus,
.darker a:hover,
.darker a:active,
.darker a:focus {
	color: #ccc;
}




/*--------------------------------------------------------------
	Header (desktop container)
--------------------------------------------------------------*/

/* home, background */
.home .main-header {
	background-color: rgba(255, 255, 255, 1);
}

/* background */
.main-header {
	background-color: #FFF;z-index: 99;
}

/* sticky, background */
.sticky.main-header {
    background-color: #fff !important;
}

.main-header-container.top {
	background: #F0F0F0;
}



/*--------------------------------------------------------------
	Header (desktop menu)
--------------------------------------------------------------*/

/* home, normal */
.home .desktop-menu a,
.home .desktop-menu a:visited,
.home .desktop-menu li.menu-item-has-children > a::after {
	color: #000;
}

/* home, hover */
.home .desktop-menu a:hover,
.home .desktop-menu a:active,
.home .desktop-menu a:focus,
.home .desktop-menu .current-menu-item a,
.home .desktop-menu li.menu-item-has-children > a:hover::after,
.home .desktop-menu li.menu-item-has-children.current-menu-item > a::after {
	color: #ccc;
}

/* normal */
.desktop-menu a,
.desktop-menu a:visited,
.desktop-menu li.menu-item-has-children > a::after {
	color: #000;
}

/* hover */
.desktop-menu a:hover,
.desktop-menu a:active,
.desktop-menu a:focus,
.desktop-menu .current-menu-item a,
.desktop-menu li.menu-item-has-children > a:hover::after,
.desktop-menu li.menu-item-has-children.current-menu-item > a::after {
	color: #ccc;
}

/* sticky, normal */
.sticky .desktop-menu a,
.sticky .desktop-menu a:visited,
.sticky .desktop-menu li.menu-item-has-children > a::after {
	color: #000;
}

/* sticky, hover */
.sticky .desktop-menu a:hover,
.sticky .desktop-menu a:active,
.sticky .desktop-menu a:focus,
.sticky .desktop-menu .current-menu-item > a,
.sticky .desktop-menu li.menu-item-has-children > a:hover::after,
.sticky .desktop-menu li.menu-item-has-children.current-menu-item > a::after {
	color: #ccc;
}

/* submenu, background */
.desktop-menu .sub-menu {
	background: #333;
}

/* submenu, normal */
.desktop-menu .sub-menu a,
.desktop-menu .sub-menu a:visited {
	color: #EC685B;
}

/* submenu, hover */
.desktop-menu .sub-menu a:hover,
.desktop-menu .sub-menu a:active,
.desktop-menu .sub-menu a:focus,
.desktop-menu .sub-menu li.current-menu-item > a {
	color: #fff;
}

/* cta, normal */
.cta a,
.cta a:visited {
	background-color: transparent;
	border-color: #EC685B;
	color: #EC685B;
}

/* cta, hover */
.cta a:hover,
.cta a:active,
.cta a:focus {
	background: transparent;
	border-color: #fff;
	color: #fff;
}

/* cta, home normal */
.home .cta a,
.home .cta a:visited {
	background: transparent;
	border-color: #EC685B;
	color: #EC685B;
}

/* cta, home hover */
.home .cta a:hover,
.home .cta a:active,
.home .cta a:focus {
	background: transparent;
	border-color: #fff;
	color: #fff;
}

/* cta, sticky normal */
.sticky .cta a,
.sticky .cta a:visited {
	background: transparent;
	border-color: #3D95CE;
	color: #3D95CE;
}

/* cta, sticky hover */
.sticky .cta a:hover,
.sticky .cta a:active,
.sticky .cta a:focus {
	background: transparent;
	border-color: #333;
	color: #333;
}




/*--------------------------------------------------------------
	Header (mobile menu)
--------------------------------------------------------------*/

/* background */
.mobile-menu {
	background-color: #000000;
}

/* normal */
.mobile-menu a,
.mobile-menu a:visited {
	color: #fff;
}

/* hover */
.mobile-menu a:hover,
.mobile-menu a:active,
.mobile-menu a:focus {
	color: #ccc;
}

/* body overlay */
#body-overlay {
	background-color: rgba(0, 0, 0, .5);
}




/*--------------------------------------------------------------
	Header (mobile menu button)
--------------------------------------------------------------*/

/* home, normal */
.home .mobile-menu-button-container span,
.home .mobile-menu-button-container .mobile-menu-button::before {
	background: #fff;
	color: #000;
}

/* home, hover */
.home .mobile-menu-button-container:hover span,
.home .mobile-menu-button-container:hover .mobile-menu-button::before {
	background: #ccc;
	color: #ccc;
}

/* normal */
.mobile-menu-button-container span,
.mobile-menu-button-container .mobile-menu-button::before {
	background: #000;
	color: #000;
}

/* hover */
.mobile-menu-button-container:hover span,
.mobile-menu-button-container:hover .mobile-menu-button::before {
	background: #ccc;
	color: #ccc;
}

/* sticky, normal */
.sticky .mobile-menu-button-container span,
.sticky .mobile-menu-button-container .mobile-menu-button::before {
	background: #000;
	color: #000;
}

/* sticky, hover */
.sticky .mobile-menu-button-container:hover span,
.sticky .mobile-menu-button-container:hover .mobile-menu-button::before {
	background: #ccc;
	color: #ccc;
}

/* open, normal */
.mobile-menu-button-container .open span,
.mobile-menu-button-container .open.mobile-menu-button::before {
	background: #fff;
	color: #fff;
}

/* open, hover */
.mobile-menu-button-container:hover .open span,
.mobile-menu-button-container:hover .open.mobile-menu-button::before {
	background: #ccc;
	color: #ccc;
}




/*--------------------------------------------------------------
	Child menu
--------------------------------------------------------------*/

/* childmenu, background */
.child-menu {
	background: #666;
	/*border-color: #3D95CE;*/
}

/* childmenu, normal */
.child-menu a,
.child-menu a:visited {
	color: #3D95CE;
}

/* childmenu, hover */
.child-menu a:hover,
.child-menu a:active,
.child-menu a:focus,
.child-menu li.current_page_item a {
	color: #fff;
}




/*--------------------------------------------------------------
	Posts
--------------------------------------------------------------*/

.archive article h2:hover,
.archive article h2:active,
.archive article h2:focus,
.archive article .light h2:hover,
.archive article .light h2:active,
.archive article .light h2:focus,
.archive article .lighter h2:hover,
.archive article .lighter h2:active,
.archive article .lighter h2:focus {
	color: #333;
}

.archive article .dark h2:hover,
.archive article .dark h2:active,
.archive article .dark h2:focus,
.archive article .darker h2:hover,
.archive article .darker h2:active,
.archive article .darker h2:focus {
	color: #fff;
}




/*--------------------------------------------------------------
	Buttons and inputs
--------------------------------------------------------------*/

/* mörk knapp */
.button,
.button:visited,
.light .button,
.light .button:visited,
.lighter .button,
.lighter .button:visited {
	background: #F6C52F;
	border-color: #F6C52F;
	color: #fff;
}

/* mörk knapp HOVER */
.button:hover,
.button:focus,
.button:active,
.light .button:hover,
.light .button:focus,
.light .button:active,
.lighter .button:hover,
.lighter .button:focus,
.lighter .button:active {
	background: #F6C52F;
	border-color: #F6C52F;
	color: #000;
}

/* ljus knapp */
.dark .button,
.dark .button:visited,
.darker .button,
.darker .button:visited {
	background: #F6C52F;
	border-color: #F6C52F;
	color: #fff;
}

/* ljus knapp HOVER */
.dark .button:hover,
.dark .button:focus,
.dark .button:active,
.darker .button:hover,
.darker .button:focus,
.darker .button:active {
	background: #F6C52F;
	border-color: #F6C52F;
	color: #000;
}

/* mörk alternativ knapp */
.alt-button,
.alt-button:visited,
.light .alt-button,
.light .alt-button:visited,
.lighter .alt-button,
.lighter .alt-button:visited {
	background: transparent;
	border-color: #3D95CE;
	color: #3D95CE;
}

/* mörk alternativ knapp HOVER */
.alt-button:hover,
.alt-button:focus,
.alt-button:active,
.light .alt-button:hover,
.light .alt-button:focus,
.light .alt-button:active,
.lighter .alt-button:hover,
.lighter .alt-button:focus,
.lighter .alt-button:active {
	background: transparent;
	border-color: #3085bd;
	color: #3085bd;
}

/* ljus alternativ knapp */
.dark .alt-button,
.dark .alt-button:visited,
.darker .alt-button,
.darker .alt-button:visited {
	background: transparent;
	border-color: #FFF;
	color: #FFF;
}

/* ljus alternativ knapp HOVER */
.dark .alt-button:hover,
.dark .alt-button:focus,
.dark .alt-button:active,
.darker  .alt-button:hover,
.darker  .alt-button:focus,
.darker  .alt-button:active {
	background: transparent;
	border-color: #FFF;
	color: #000;
}

/* liten mörk knapp */
.small-button,
.small-button:visited,
.light .small-button,
.light .small-button:visited,
.lighter .small-button,
.lighter .small-button:visited {
	background: #3D95CE;
	border-color: #3D95CE;
	color: #fff;
}

/* liten mörk knapp HOVER */
.small-button:hover,
.small-button:focus,
.small-button:active,
.light .small-button:hover,
.light .small-button:focus,
.light .small-button:active,
.lighter .small-button:hover,
.lighter .small-button:focus,
.lighter .small-button:active {
	background: #3085bd;
	border-color: #3085bd;
	color: #fff;
}

/* liten ljus knapp */
.dark .small-button,
.dark .small-button:visited,
.darker .small-button,
.darker .small-button:visited {
	background: #EC685B;
	border-color: #EC685B;
	color: #fff;
}

/* liten ljus knapp HOVER */
.dark .small-button:hover,
.dark .small-button:focus,
.dark .small-button:active,
.darker .small-button:hover,
.darker .small-button:focus,
.darker .small-button:active {
	background: #e94f40;
	border-color: #e94f40;
	color: #fff;
}

/* liten mörk alternativ knapp */
.small-alt-button,
.small-alt-button:visited,
.light .small-alt-button,
.light .small-alt-button:visited,
.lighter .small-alt-button,
.lighter .small-alt-button:visited {
	background: transparent;
	border-color: #3D95CE;
	color: #3D95CE;
}

/* liten mörk alternativ knapp HOVER */
.small-alt-button:hover,
.small-alt-button:focus,
.small-alt-button:active,
.light .small-alt-button:hover,
.light .small-alt-button:focus,
.light .small-alt-button:active,
.lighter .small-alt-button:hover,
.lighter .small-alt-button:focus,
.lighter .small-alt-button:active {
	background: transparent;
	border-color: #3085bd;
	color: #3085bd;
}

/* liten ljus alternativ knapp */
.dark .small-alt-button,
.dark .small-alt-button:visited,
.darker .small-alt-button,
.darker .small-alt-button:visited {
	background: transparent;
	border-color: #EC685B;
	color: #EC685B;
}

/* liten ljus alternativ knapp HOVER */
.dark .small-alt-button:hover,
.dark .small-alt-button:focus,
.dark .small-alt-button:active,
.darker  .small-alt-button:hover,
.darker  .small-alt-button:focus,
.darker  .small-alt-button:active {
	background: transparent;
	border-color: #e94f40;
	color: #e94f40;
}

/* mörk submit knapp */
input[type="submit"],
input[type="submit"]:visited,
.light input[type="submit"],
.light input[type="submit"]:visited,
.lighter input[type="submit"],
.lighter input[type="submit"]:visited {
	background: #F6C52F;
	border-color: #F6C52F;
	color: #fff;
}

/* mörk submit knapp HOVER */
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="submit"]:active,
.light input[type="submit"]:hover,
.light input[type="submit"]:focus,
.light input[type="submit"]:active,
.lighter input[type="submit"]:hover,
.lighter input[type="submit"]:focus,
.lighter input[type="submit"]:active {
	background: #F6C52F;
	border-color: #F6C52F;
	color: #000;
}

/* ljus submit knapp */
.dark input[type="submit"],
.dark input[type="submit"]:visited,
.darker input[type="submit"],
.darker input[type="submit"]:visited {
	background: #EC685B;
	border-color: #EC685B;
	color: #fff;
}

/* ljus submit knapp HOVER */
.dark input[type="submit"]:hover,
.dark input[type="submit"]:focus,
.dark input[type="submit"]:active,
.darker input[type="submit"]:hover,
.darker input[type="submit"]:focus,
.darker input[type="submit"]:active {
	background: #e94f40;
	border-color: #e94f40;
	color: #fff;
}

input,
.light input,
.lighter input,
textarea,
.light textarea,
.lighter textarea,
select,
.light select,
.lighter select {
	background-color: transparent;
	border-color: #333;
	color: #333;
}

.dark input,
.darker input,
.dark textarea,
.darker textarea,
.dark select,
.darker select {
	background-color: transparent;
	border-color: #fff;
	color: #fff;
}

input[type="text"]:focus,
.light input[type="text"]:focus,
.lighter input[type="text"]:focus,
textarea:focus,
.light textarea:focus,
.lighter textarea:focus,
select:focus,
.light select:focus,
.lighter select:focus {
	background-color: transparent;
	border-color: #3D95CE;
}

.dark input[type="text"]:focus,
.darker input[type="text"]:focus,
.dark textarea:focus,
.darker textarea:focus,
.dark select:focus,
.darker select:focus {
	background-color: transparent;
	border-color: #3085bd;
}

::-webkit-input-placeholder,
.light ::-webkit-input-placeholder,
.lighter ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #aaa;
}

.dark ::-webkit-input-placeholder,
.darker ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #aaa;
}

::-moz-placeholder,
.light ::-moz-placeholder,
.lighter ::-moz-placeholder {
	color: #aaa;
}

.dark ::-moz-placeholder,
.darker ::-moz-placeholder {
	color: #aaa;
}

:-ms-input-placeholder,
.light :-ms-input-placeholder,
.lighter :-ms-input-placeholder { /* IE 10+ */
	color: #aaa;
}

.dark :-ms-input-placeholder,
.darker :-ms-input-placeholder { /* IE 10+ */
	color: #aaa;
}

::placeholder,
.light ::placeholder,
.lighter ::placeholder {
	color: #aaa;
}

.dark ::placeholder,
.darker ::placeholder {
	color: #aaa;
}

.ui-datepicker {
	background: #fff;
	border-color: #fff;
	box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2);
}

.ui-datepicker-next::after, 
.ui-datepicker-prev::before {
    color: #3D95CE;
}

.ui-datepicker-next:hover::after, 
.ui-datepicker-prev:hover::before {
    color: #3085bd;
}

.ui-datepicker-month,
.ui-datepicker-year {
    border-color: #3D95CE;
    color: #3D95CE;
	background: transparent;
}

.ui-datepicker-month:hover,
.ui-datepicker-year:hover {
    border-color: #3085bd;
    color: #3085bd;
    background: transparent;
}

.ui-datepicker th {
	color: #333;
}

.ui-datepicker td a {
	color: #3D95CE;
}

.ui-datepicker td a:hover {
	color: #3085bd;
}

/* dropdown arrow */
.ginput_container_select::after {
    color: #fff;
}




/*--------------------------------------------------------------
	Footer
--------------------------------------------------------------*/




/*--------------------------------------------------------------
	Slick slider
--------------------------------------------------------------*/

.slick-prev::before,
.slick-next::before,
.light .slick-prev::before,
.light .slick-next::before,
.lighter .slick-prev::before,
.lighter .slick-next::before {
    background: #3D95CE;
    color: #fff;
}

.slick-prev:hover::before,
.slick-next:hover::before,
.light .slick-prev:hover::before,
.light .slick-next:hover::before,
.lighter .slick-prev:hover::before,
.lighter .slick-next:hover::before {
    background: #3085bd;
    color: #fff;
}

.dark .slick-prev::before,
.dark .slick-next::before,
.darker .slick-prev::before,
.darker .slick-next::before {
    background: #EC685B;
    color: #fff;
}

.dark .slick-prev:hover::before,
.dark .slick-next:hover::before,
.darker .slick-prev:hover::before,
.darker .slick-next:hover::before {
    background: #e94f40;
    color: #fff;
}

.slick-dots li,
.light .slick-dots li,
.lighter .slick-dots li {
    border-color: #3D95CE;
}

.slick-dots li.slick-active,
.light .slick-dots li.slick-active,
.lighter .slick-dots li.slick-active {
    background: #3D95CE;
}

.dark .slick-dots li,
.darker .slick-dots li {
    border-color: #fff;
}

.dark .slick-dots li.slick-active,
.darker .slick-dots li.slick-active {
    background: #fff;
}




/*--------------------------------------------------------------
	Overlay
--------------------------------------------------------------*/

.light-filter::after {
	background: rgba(255, 255, 255, .5);
}

.dark-filter::after {
	background: rgba(74, 74, 74, .5);
}

.dark-filter.red::after {
	background: rgba(157, 23, 32, .5);
}

.dark-filter.green::after {
	background: rgb(0 0 0 / 50%);
}

.dark-filter.blue::after {
	background: rgb(8 36 45 / 70%);
}
 
