altinn-designsystem
Version:
Altinn Design system based on Pattern Lab.
1,394 lines (881 loc) • 50.1 kB
HTML
<!-- START: 04-sider-portal-50-innboks-_01-innboks-start-nyoppstartet -->
<!-- START: 03-maler-portal-50-innboks-_01-innboks-start-nyoppstartet -->
<div class="a-page">
<span class="a-js-bodyClassPersist" data-body="a-bgBlueLight"></span>
<!-- START: 02-organismer-01-globale-00-header -->
<!-- Skip to main content -->
<nav class="a-jumpnav">
<ul class="no-decoration d-flex">
<li><a class="sr-only sr-only-focusable" href="#content">Hopp til hovedinnholdet</a></li>
<li><a class="sr-only sr-only-focusable" href="#primary-nav">Hopp til hovedmeny</a></li>
<li><a class="sr-only sr-only-focusable" href="#search">Hopp til søk</a></li>
</ul>
</nav>
<!-- Begin .header -->
<header class="a-header a-js-hideElement ">
<!-- Begin .container -->
<div class="container">
<div class="row">
<div class="col-12">
<!-- Begin .a-globalNav -->
<nav id="primary-nav" class="a-globalNav">
<a href="/patterns/04-sider-infoportal-01-forside-02-forside-innlogget\04-sider-infoportal-01-forside-02-forside-innlogget.html" class="a-globalNav-logo">
<!-- START: 00-atomer-09-bilder-og-media-01-logo -->
<img src="../../images/a-logo-blue.svg" alt="Altinn logo" class="a-logo a-modal-top-logo ">
<!-- END: 00-atomer-09-bilder-og-media-01-logo -->
<span class="sr-only">Til forsiden</span>
</a>
<button class="navbar-toggler d-md-none" type="button">
<span class="sr-only">Vis/skjul meny</span>
</button>
<div class="collapse navbar-toggleable-sm a-globalNav-main" id="exCollapsingNavbar2">
<ul class="" id="exCollapsingNavbar">
<li class="d-md-none">
<!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->
<div class="form-group a-form-group ">
<label class="a-form-label sr-only " for="dropdown-input-search">Søk etter innhold</label>
<div class="a-form-group-items input-group ">
<input class="form-control
a-hasButton " type="search" placeholder="Søk etter innhold" name="input-field" data-val="true" id="dropdown-input-search">
<div class="input-group-append">
<button onclick="location.href='/patterns/04-sider-infoportal-40-sok-00-sok-forside/04-sider-infoportal-40-sok-00-sok-forside.html';" class="btn btn-secondary" type="button">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-search " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="sr-only">Søk</span>
</button>
</div>
</div>
</div>
<!-- END: 00-atomer-01-forms-10-tekst-input -->
</li>
<li class="d-md-none dropdown">
<a lang="en" class="nav-link dropdown-toggle a-languageSwitcher" href="javascript:void(0)" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
language
</a>
<!-- START: 02-organismer-30-seksjoner-29-meny-spraakvalg -->
<!-- Begin #a-dropdown-languages - -->
<div class="dropdown-menu a-dropdown-languages a-dropdownTriangle">
<a class="dropdown-item" href="#">
<img src="../../images/norsk.svg" class="a-iconLeft a-flag" alt="" />
<p>
<span class="a-h3">Bokmål</span><br>
<span >Alt innhold er tilgjengelig på bokmål.</span>
</p>
</a>
<a class="dropdown-item" href="#">
<img src="../../images/english.svg" class="a-iconLeft a-flag" alt="" />
<p>
<span lang="en" class="a-h3">English</span><br>
<span lang="en">All content is available in english.</span>
</p>
</a>
<a class="dropdown-item" href="#">
<img src="../../images/norsk.svg" class="a-iconLeft a-flag" alt="" />
<p>
<span class="a-h3">Nynorsk</span><br>
<span >Det er førebels berre skjema som er tilgjengelig på nynorsk. Andre sider vil vises med bokmål.</span>
</p>
</a>
<a class="dropdown-item" href="#">
<img src="../../images/globe.svg" class="a-iconLeft a-flag a-globe" alt="" />
<p>
<span lang="en" class="a-h3">Other languages</span><br>
<span lang="en">Information about other languages.</span>
</p>
</a>
</div>
<!-- END: 02-organismer-30-seksjoner-29-meny-spraakvalg -->
</li>
<li><a class="a-hvr-underline globalNav-active " href="/patterns/04-sider-portal-50-innboks-00-innboks\04-sider-portal-50-innboks-00-innboks.html">innboks</a></li>
<li><a class="a-hvr-underline " href="/patterns/04-sider-infoportal-20-navigasjonssider-50-kolonnenavigasjon-v-skjemaoversikt\04-sider-infoportal-20-navigasjonssider-50-kolonnenavigasjon-v-skjemaoversikt.html">alle skjema</a></li>
<li><a class="a-hvr-underline " href="/patterns/04-sider-portal-60-profil-roller-rettigheter-01-profil-roller-rettigheter\04-sider-portal-60-profil-roller-rettigheter-01-profil-roller-rettigheter.html"><span class="a-js-onboardingTarget-2 ">profil</span></a></li>
<li class="d-md-none"><a class="a-nav-link a-hvr-underline" href="/patterns/04-sider-infoportal-10-seksjonsforsider-30-seksjonsforside-v-starteogdrive\04-sider-infoportal-10-seksjonsforsider-30-seksjonsforside-v-starteogdrive.html">starte og drive bedrift</a></li>
<li class="d-md-none"><a class="a-hvr-underline" href="/patterns/04-sider-infoportal-20-navigasjonssider-46-navigasjonsartikkel-v-omaltinn-v2\04-sider-infoportal-20-navigasjonssider-46-navigasjonsartikkel-v-omaltinn-v2.html">om altinn</a></li>
<li class="d-md-none">
<a class="a-hvr-underline" href="/patterns/04-sider-infoportal-20-navigasjonssider-70-hjelpesenter\04-sider-infoportal-20-navigasjonssider-70-hjelpesenter.html">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-nw ai-nw-pr ai-phone "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
hjelp og kontakt
</a>
</li>
</ul>
</div>
</nav>
<!-- End .a-globalNav -->
<!-- Begin .a-globalNav-options -->
<ul id="secondary-nav" class="nav nav-pills a-header-options">
<li class="nav-item dropdown d-none d-md-block">
<!-- Dropdown toggle -->
<a lang="en" class="nav-link dropdown-toggle a-languageSwitcher" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Language
</a>
<!-- START: 02-organismer-30-seksjoner-29-meny-spraakvalg -->
<!-- Begin #a-dropdown-languages - -->
<div class="dropdown-menu a-dropdown-languages a-dropdownTriangle">
<a class="dropdown-item" href="#">
<img src="../../images/norsk.svg" class="a-iconLeft a-flag" alt="" />
<p>
<span class="a-h3">Bokmål</span><br>
<span >Alt innhold er tilgjengelig på bokmål.</span>
</p>
</a>
<a class="dropdown-item" href="#">
<img src="../../images/english.svg" class="a-iconLeft a-flag" alt="" />
<p>
<span lang="en" class="a-h3">English</span><br>
<span lang="en">All content is available in english.</span>
</p>
</a>
<a class="dropdown-item" href="#">
<img src="../../images/norsk.svg" class="a-iconLeft a-flag" alt="" />
<p>
<span class="a-h3">Nynorsk</span><br>
<span >Det er førebels berre skjema som er tilgjengelig på nynorsk. Andre sider vil vises med bokmål.</span>
</p>
</a>
<a class="dropdown-item" href="#">
<img src="../../images/globe.svg" class="a-iconLeft a-flag a-globe" alt="" />
<p>
<span lang="en" class="a-h3">Other languages</span><br>
<span lang="en">Information about other languages.</span>
</p>
</a>
</div>
<!-- END: 02-organismer-30-seksjoner-29-meny-spraakvalg -->
</li>
<li class="nav-item">
<!-- Dropdown toggle -->
<!-- START: 00-atomer-07-tekst-40-innlogget -->
<button class="nav-link dropdown-toggle a-personSwitcher logged-in " type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="JAN PETTERSEN for Pettersen Foto">
<span
class="a-personSwitcher-name">
<span class="d-block">JAN PETTERSEN</span>
<span class="d-block">for Pettersen Foto</span>
</span>
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-corp a-personSwitcher-icon a-js-onboardingTarget-1 " ></i>
<span class="sr-only">Min profil</span>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
</button>
<!-- END: 00-atomer-07-tekst-40-innlogget -->
<!-- START: 02-organismer-30-seksjoner-30-meny-personbytte -->
<!-- Begin #a-dropdown-personswitchList - -->
<div class="dropdown-menu a-dropdown-personswitchList a-dropdownTriangle">
<div class="pt-5 pl-3 pr-3">
<!-- START: 00-atomer-02-lenker-00-link -->
<a href="/patterns/04-sider-infoportal-01-forside-00-forside/04-sider-infoportal-01-forside-00-forside.html" class="a-link-logout ">
Logg ut
</a>
<!-- END: 00-atomer-02-lenker-00-link -->
<div class="row">
<div class="col-sm-12 mb-2">
<!-- START: 01-molekyler-00-tekst-01-person-privat -->
<div class="a-personRole">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-lg "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<div class="a-personRole-text " title="Jan Derek Sørensen Julius Andreas Gimli Arn MacGyver Chewbacka Highlander Elessar-Jankov">
<span class="a-personRole-name">Jan Derek Sørensen Julius Andreas Gimli Arn MacGyver Chewbacka Highlander Elessar-Jankov</span>
<span class="a-personRole-role"></span>
<!-- START: 00-atomer-02-lenker-00-link -->
<a href="/patterns/04-sider-portal-60-profil-roller-rettigheter-01-profil-roller-rettigheter/04-sider-portal-60-profil-roller-rettigheter-01-profil-roller-rettigheter.html" class=" ">
Innstillinger
</a>
<!-- END: 00-atomer-02-lenker-00-link -->
</div>
</div>
<!-- END: 01-molekyler-00-tekst-01-person-privat -->
</div>
</div>
<p class="a-h2">
Alle dine profiler:
</p>
<!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->
<div class="form-group a-form-group ">
<label class="a-form-label sr-only " for="person-switch-input-field">Søk etter aktør</label>
<div class="a-form-group-items input-group ">
<span class="input-group-prepend d-none d-md-block"><!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-others " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
</span>
<input class="form-control a-hasIcon
" type="search" placeholder="Søk etter aktør" name="input-field" data-val="true" id="person-switch-input-field">
</div>
</div>
<!-- END: 00-atomer-01-forms-10-tekst-input -->
<p class="a-fontBold a-fontSizeXS">
Ingen treff, prøv et annet søkeord.
<p>
</div>
<!-- START: 02-organismer-30-seksjoner-31-personbytte -->
<div class="px-2 pt-3 ">
<!-- START: 00-atomer-01-forms-00-avkrysningsboks -->
<div class="custom-control custom-control-inline custom-checkbox a-custom-checkbox a-form-checkboxes--discret ">
<input type="checkbox" id="check21" class="custom-control-input">
<label class="custom-control-label " for="check21">Se alle underenheter</label>
</div>
<div class="custom-control custom-control-inline custom-checkbox a-custom-checkbox a-form-checkboxes--discret ">
<input type="checkbox" id="check22" class="custom-control-input">
<label class="custom-control-label " for="check22">Se slettede enheter</label>
</div>
<!-- END: 00-atomer-01-forms-00-avkrysningsboks -->
</div>
<div class="pt-1 px-1">
<!-- START: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<div class="a-listWithSubLevels a-shadow">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn-shadow-large a-btn a-btn-shadow a-btn-icon " onclick="location.href='/patterns/04-sider-portal-50-innboks-00-innboks/04-sider-portal-50-innboks-00-innboks.html';" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-corp ai-left " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-btn-icon-text a-fontBold">
Pettersen foto
<span class="a-btn-icon-text-second a-fontReg a-fontSizeXS">org.nr. 893 234 789</span>
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<!-- END: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<!-- START: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<div class="a-listWithSubLevels a-shadow">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn disabled a-btn-shadow-large a-btn-shadow a-btn-icon " onclick="location.href='/patterns/04-sider-portal-50-innboks-00-innboks/04-sider-portal-50-innboks-00-innboks.html';" disabled title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-corp ai-left " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-btn-icon-text a-fontBold">
Pettersen Regnskap
<span class="a-btn-icon-text-second a-fontReg a-fontSizeXS">org.nr. 893 234 789</span>
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<div class="a-list-heading">
<!-- START: 00-atomer-05-Ekspansjonsknapper-25-ekspanderbar-knapp -->
<button class="a-btn a-offset-border-top a-btn-shadow a-btn-shadow-expand a-btn-icon collapsed " type="button" data-toggle="collapse" data-target="#listsublevels2" aria-expanded="false" aria-controls="listsublevels2">
<span class="a-dropdownCircleArrow">
<i class="ai ai-expand ai-sm"><span class="sr-only">Vis/skjul innhold</span></i>
</span>
6 underenheter
</button>
<!-- END: 00-atomer-05-Ekspansjonsknapper-25-ekspanderbar-knapp -->
</div>
<div id="listsublevels2" class="a-collapseContent a-bgBlueLighter collapse ">
<!-- START: 01-molekyler-05-lister-00-liste-unummerert JS doc: selectableCheckbox.js -->
<div class="a-list-container ">
<ul class="a-list a-list-large ">
<li class="a-clickable a-list-hasRowLink">
<a href="http://altinn.no" class="a-list-rowLink a-fontSizeXS">
<div class="row ">
<div class="col">
<!-- START: 01-molekyler-05-lister-_00-liste-innhold -->
<b>Pettersen Regnskap – Stavanger AS</b> org. nr. 908 987 519
<!-- END: 01-molekyler-05-lister-_00-liste-innhold -->
</div>
</div>
</a>
</li>
<li class="a-clickable a-offset-border-top a-list-hasRowLink">
<a href="http://altinn.no" class="a-list-rowLink a-fontSizeXS">
<div class="row ">
<div class="col">
<!-- START: 01-molekyler-05-lister-_00-liste-innhold -->
<b>Pettersen Regnskap – Arendal AS</b> org. nr. 908 987 519
<!-- END: 01-molekyler-05-lister-_00-liste-innhold -->
</div>
</div>
</a>
</li>
<li class="a-clickable a-offset-border-top a-list-hasRowLink">
<a href="http://altinn.no" class="a-list-rowLink a-fontSizeXS">
<div class="row ">
<div class="col">
<!-- START: 01-molekyler-05-lister-_00-liste-innhold -->
<b>Pettersen Regnskap – Kristiansand AS</b> org. nr. 908 987 519
<!-- END: 01-molekyler-05-lister-_00-liste-innhold -->
</div>
</div>
</a>
</li>
</ul>
</div>
<!-- END: 01-molekyler-05-lister-00-liste-unummerert -->
</div>
</div>
<!-- END: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<!-- START: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<div class="a-listWithSubLevels a-shadow">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn-shadow-large a-btn a-btn-shadow a-btn-icon a-bgGreyLight " onclick="location.href='/patterns/04-sider-portal-50-innboks-00-innboks/04-sider-portal-50-innboks-00-innboks.html';" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-left " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-btn-icon-text a-fontBold">
Anne Pettersen
<span class="a-btn-icon-text-second a-fontReg a-fontSizeXS">Personnr. 123456 12345</span>
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<!-- END: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<!-- START: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<div class="a-listWithSubLevels a-shadow">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn-shadow-large a-btn a-btn-shadow a-btn-icon a-bgGreyLight " onclick="location.href='/patterns/04-sider-portal-50-innboks-00-innboks/04-sider-portal-50-innboks-00-innboks.html';" title="Jan Derek Sørensen Julius Andreas Gimli Arn MacGyver Chewbacka Highlander Elessar-Jankov">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-private ai-left " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-btn-icon-text a-fontBold a-btn-icon-text-ellipsis">
Jan Derek Sørensen Julius Andreas Gimli Arn MacGyver Chewbacka Highlander Elessar-Jankov
<span class="a-btn-icon-text-second a-fontReg a-fontSizeXS">Personnr. 123456 12344</span>
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<!-- END: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<!-- START: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<div class="a-listWithSubLevels a-shadow">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class=" a-btn-shadow-large a-btn a-btn-shadow a-btn-icon " onclick="location.href='/patterns/04-sider-portal-50-innboks-00-innboks/04-sider-portal-50-innboks-00-innboks.html';" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-corp ai-left " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-btn-icon-text a-fontBold">
Pettersen Tallknuser (slettet)
<span class="a-btn-icon-text-second a-fontReg a-fontSizeXS">org.nr. 893 234 789</span>
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<!-- END: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<!-- START: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<div class="a-listWithSubLevels a-shadow">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn a-btn-shadow a-btn-shadow-large a-btn-icon " onclick="location.href='/patterns/04-sider-portal-50-innboks-00-innboks/04-sider-portal-50-innboks-00-innboks.html';" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-corp ai-left " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-btn-icon-text a-fontBold">
Pettersen Bygg
<span class="a-btn-icon-text-second a-fontReg a-fontSizeXS">org.nr. 893 234 789</span>
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<!-- END: 01-molekyler-02-navigasjon-55-ekspanderbar-liste-status -->
<!-- START: 00-atomer-04-handlingsknapper-17-handlingsknapp -->
<button onclick="location.href='/patterns/04-sider-portal-01-aktorvalg-10-aktorvalg/04-sider-portal-01-aktorvalg-10-aktorvalg.html'" type="button" class="a-btn a-btn-action a-fullWidthBtn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-plus " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span>Vis alle aktører</span>
</button>
<!-- END: 00-atomer-04-handlingsknapper-17-handlingsknapp -->
</div>
<!-- END: 02-organismer-30-seksjoner-31-personbytte -->
</div>
<!-- END: 02-organismer-30-seksjoner-30-meny-personbytte -->
</li>
</ul>
<!-- End .a-globalNav-options -->
</div>
<!-- End .col -->
</div>
<!-- End .row -->
</div>
<!-- End .container -->
</header>
<!-- End .header -->
<!-- END: 02-organismer-01-globale-00-header -->
<div class="container" id="content" tabindex="-1">
<div class="row mt-3 mb-3">
<div class="col-sm-8 offset-sm-2 col-lg-6 offset-lg-3">
<!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->
<div class="form-group a-form-group a-form-group-large ">
<label class="a-form-label sr-only " for="text-input-generic">Søk i meldinger og annet innhold</label>
<div class="a-form-group-items input-group ">
<input class="form-control
a-hasButton " type="text" placeholder="Søk i meldinger og annet innhold" name="input-field" data-val="true" id="text-input-generic">
<div class="input-group-append">
<button class="btn btn-secondary" type="button">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-search " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="sr-only">Søk</span>
</button>
</div>
</div>
</div>
<!-- END: 00-atomer-01-forms-10-tekst-input -->
</div>
</div>
<!-- START: 01-molekyler-02-navigasjon-11-toppoppgaver -->
<div class="row a-topTasks">
<div class="col col-lg-12">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn a-active a-btn-icon a-btn-transparentWhite " onclick="location.href='/patterns/04-sider-portal-50-innboks-_11-innboks-mva-og-skatt-nyoppstartet/04-sider-portal-50-innboks-_11-innboks-mva-og-skatt-nyoppstartet.html';"
title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-closedmessage a-btn-icon-symbol " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<br />
<span class="a-btn-icon-text ">
alle
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<div class="col col-lg-12">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn a-btn-icon a-btn-transparentWhite " onclick="location.href='/patterns/04-sider-portal-50-innboks-05-innboks-arkiv/04-sider-portal-50-innboks-05-innboks-arkiv.html';" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-archive a-btn-icon-symbol " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<br />
<span class="a-btn-icon-text ">
arkiv
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<div class="col col-lg-12">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn a-btn-icon a-btn-transparentWhite " onclick="location.href='/patterns/04-sider-portal-50-innboks-08-innboks-slettede-meldinger/04-sider-portal-50-innboks-08-innboks-slettede-meldinger.html';" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-trash a-btn-icon-symbol " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<br />
<span class="a-btn-icon-text ">
slettede
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<div class="col col-lg-12 d-lg-none">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn a-btn-icon a-btn-transparentWhite " data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-more a-btn-icon-symbol " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<br />
<span class="a-btn-icon-text ">
mer
</span>
</button>
<!-- START: 02-organismer-30-seksjoner-_45-dropdown-overflow -->
<div class="dropdown-menu py-0 mx-0 my-0 a-dropdownTriangle
a-dropdown-overflow-menu
" role="popover" data-boundary="col-lg-auto col-12 mt-3">
<div class="a-overflow-dropdown pt-1 pb-1">
<span>Lagrede søk</span>
</div>
<a class="a-overflow-dropdown " href="#">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-letter-r a-blue "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-fontBold">Alt innhold er tilgjengelig på bokmål.</span>
</a>
<a class="a-overflow-dropdown " href="#">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-letter-r a-blue "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-fontBold">All content is available in english.</span>
</a>
<a class="a-overflow-dropdown " href="#">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-settings a-blue "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="a-fontBold">Det er førebels berre skjema som er tilgjengelig på nynorsk. Andre sider vil vises med bokmål.</span>
</a>
<a class="a-overflow-dropdown " href="#">
<span>Information about other languages.</span>
</a>
</div>
<!-- END: 02-organismer-30-seksjoner-_45-dropdown-overflow -->
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
<div class="col col-lg-12 d-lg-none">
<!-- START: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
<button type="button" class="a-btn a-btn-icon a-btn-transparentWhite " onclick="location.href='/patterns/04-sider-portal-50-innboks-_10-innboks-mva-og-skatt/04-sider-portal-50-innboks-_10-innboks-mva-og-skatt.html';" title="Altinn">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-plus a-btn-icon-symbol a-button-icon-symbol--secondary " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<br />
<span class="a-btn-icon-text ">
nytt
</span>
</button>
<!-- END: 00-atomer-03-knapper-25-knapp-ikon-tekst -->
</div>
</div>
<!-- END: 01-molekyler-02-navigasjon-11-toppoppgaver -->
<div class="row">
<div class="col-sm-12 col-lg-12 mt-4 a-p-x9-xl">
<!-- START: 00-atomer-07-tekst-09-sidetittel -->
<h1 class="a-fontBold a-pageTitle a-h2 a-fontReg">
I dag
</h1>
<!-- END: 00-atomer-07-tekst-09-sidetittel -->
</div>
<!-- END .col-... -->
</div>
<!-- END .row -->
<div class="row">
<div class="col-sm-12 col-lg-12 mb-4 ">
<!-- START: 02-organismer-50-ekspanderbart-panel-40-ekspanderbart-panel-trekkspill JS doc: toggleInstant.js -->
<div id="accordion" class="a-panelAccordion" role="tablist">
<!-- START: 02-organismer-50-ekspanderbart-panel-30-ekspanderbart-panel JS doc: togglePanel.js -->
<div class="card a-accordion-card a-collapsePanel ">
<div class="card-header a-js-index-heading a-collapsePanel-heading collapsed expanded" role="tab">
<a href="#" data-toggle="collapse" data-target="#accordionItem1" aria-expanded="false" aria-controls="accordionItem1">
<!-- START: 01-molekyler-00-tekst-30-ikon-tekst -->
<div class="a-iconText a-iconText-shadow a-collapseBtn collapsed ">
<div class="a-iconText-icon ">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-openmessage a-icon a-icon-circle a-bgBlue "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
</div>
<div class="a-iconText-text">
<span class="a-iconText-text-small">Altinn</span>
<span class="a-iconText-text-large">Gratulerer! Du har fått deg et enkeltpersonforetak </span>
</div>
</div>
<!-- END: 01-molekyler-00-tekst-30-ikon-tekst -->
</a>
</div>
<div class="a-collapsePanel-body collapse in" data-parent="#accordion" role="tabpanel" aria-labelledby="" id="accordionItem1">
<div class="card-block a-text a-collapsePanel-body-content a-collapseContent-delay">
<div class="row">
<div class="col-12">
<p class="a-fontBold">Du er nå registrert som “Pettersen Foto” med organisasjonsummeret 321.431.123.</p>
<p>Her er noen nyttige tips for veien videre for deg og ditt enkeltpersonsforetak.</p>
<p class="a-fontBold">1. Skal du sende din første faktura?</p>
<p>Skal du fakturere kunder fremover så er det viktig å gjøre seg opp et regnestykke for om det er nødvendig å anskaffe seg en regnskapsfører eller revisor. Det er absolutt ikke et krav til bruk av regnskapsfører eller revisor, men du
må vurdere det ut i fra hvor mye du skal fakturere for og hvor mye tid det tar fra deg til å gjøre jobben din. Det finnes flere gratisprogrammer man kan bruke. Uansett hva du ender opp med, husk bare at det er noen krav til hvordan
en faktura skal se ut og hva den skal inneholde.Hva skal stå på salgsdokumentene?</p>
<p class="a-fontBold">2. Trenger du støtte i oppstarten?</p>
<p>Vurder å søke tilskudd eller let etter passende støtteordninger. Vi har satt sammen en oversikt over alle offentlige støtteordninger rettet mot næringsdrivende i Norge.Finn støtteordninger</p>
<p class="a-fontBold">3. Skal du ta ut lønn?</p>
<p>Når inntektene dine er større enn utgiftene/kostnadene, blir det et overskudd. Det er dette du bruker som grunnlaget for beregning av skatt. Dette anses ikke som lønn. Det gjelder forøvrig hvis du har en ektefelle som gjør et stykke
arbeid for deg også, utbetaling til ektefelle er heller ikke lønn.Lønn og skatt for enkeltpersonforetak</p>
</div>
</div>
</div>
</div>
</div>
<!-- END: 02-organismer-50-ekspanderbart-panel-30-ekspanderbart-panel -->
<!-- START: 02-organismer-50-ekspanderbart-panel-30-ekspanderbart-panel JS doc: togglePanel.js -->
<div class="card a-accordion-card a-collapsePanel ">
<div class="card-header a-js-index-heading a-collapsePanel-heading collapsed" role="tab">
<a href="#" data-toggle="collapse" data-target="#accordionItem2" aria-expanded="false" aria-controls="accordionItem2">
<!-- START: 01-molekyler-00-tekst-30-ikon-tekst -->
<div class="a-iconText a-iconText-shadow a-collapseBtn collapsed ">
<div class="a-iconText-icon ">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-closedmessage a-icon a-icon-circle a-bgBlue "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
</div>
<div class="a-iconText-text">
<span class="a-iconText-text-small">Altinn</span>
<span class="a-iconText-text-large">Ti ting du må huske på når du har enkeltpersonforetak. </span>
</div>
</div>
<!-- END: 01-molekyler-00-tekst-30-ikon-tekst -->
</a>
</div>
<div class="a-collapsePanel-body collapse" data-parent="#accordion" role="tabpanel" aria-labelledby="" id="accordionItem2">
<div class="card-block a-text a-collapsePanel-body-content a-collapseContent-delay">
<div class="row">
<div class="col-12">
Meldingen kommer her..
</div>
</div>
</div>
</div>
</div>
<!-- END: 02-organismer-50-ekspanderbart-panel-30-ekspanderbart-panel -->
</div>
<!-- END: 02-organismer-50-ekspanderbart-panel-40-ekspanderbart-panel-trekkspill -->
</div>
<!-- END .col-... -->
</div>
<!-- END .row -->
<!-- START: 02-organismer-70-Modal-innhold-40-onboarding-start JS doc: clipboard.js -->
<!-- Button trigger modal-->
<button type="button" class="a-btn a-js-modalLauncher" data-toggle="modal" data-target="#modalOnboarding">
<!-- <button type="button" class="a-btn a-js-modalLauncher hidden-xl-down" data-toggle="modal" data-target="#modalOnboarding"> -->
Vis introen
</button>
<!-- Modal -->
<div class="modal a-modal fade a-onboarding" id="modalOnboarding" role="dialog" aria-labelledby="" aria-hidden="true" data-backdrop="false">
<div class="a-modal-bottomBG">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<!--<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>-->
<h4 class="modal-title" id="myModalLabel">1 av 7</h4>
</div>
<div class="modal-body">
<div class="clearfix">
<!-- START: 00-atomer-07-tekst-02-intro-tekst -->
<p class="a-leadText " id="leadText">Gratulerer, du har fått deg et enkeltpersonforetak! Her er det nye organisasjonsnummeret ditt.</p>
<!-- END: 00-atomer-07-tekst-02-intro-tekst -->
<div class="a-textureLines clearfix">
<button class="a-js-btnCopy a-btn-noStyle" data-clipboard-text="321 431 312">
321 431 312
</button>
</div>
<span class="a-js-clipboardMsg"></span>
</div>
</div>
<div class="modal-footer">
<div class="a-btn-group">
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn ">
Ok!
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn-link a-textWhite " data-dismiss="modal">
<span>
Hopp over introen
</span>
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
</div>
</div>
</div>
<div class="modal-content">
<div class="modal-header">
<!--<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>-->
<h4 class="modal-title" id="myModalLabel">2 av 7</h4>
</div>
<div class="modal-body">
<div class="clearfix">
<!-- START: 00-atomer-07-tekst-02-intro-tekst -->
<p class="a-leadText " id="leadText">Dette betyr også at du har fått en ny «aktør» i altinn. Når du skal skifte mellom deg som privatperson og foretaket ditt klikker du her.</p>
<!-- END: 00-atomer-07-tekst-02-intro-tekst -->
</div>
</div>
<div class="modal-footer">
<div class="a-btn-group">
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn ">
Den er grei!
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
</div>
</div>
</div>
<div class="modal-content">
<div class="modal-header">
<!--<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>-->
<h4 class="modal-title" id="myModalLabel">3 av 7</h4>
</div>
<div class="modal-body">
<div class="clearfix">
<!-- START: 00-atomer-07-tekst-02-intro-tekst -->
<p class="a-leadText " id="leadText">Skal du ha regnskapsfører, revisor eller en annen daglig leder enn deg selv legger du dem til under profil. Her kan du også endre din kontaktinformasjon og gi andre tilgang til dine skjema og meldinger.</p>
<!-- END: 00-atomer-07-tekst-02-intro-tekst -->
</div>
</div>
<div class="modal-footer">
<div class="a-btn-group">
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn ">
Ok!
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
</div>
</div>
</div>
<div class="modal-content">
<div class="modal-header">
<!--<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>-->
<h4 class="modal-title" id="myModalLabel">4 av 7</h4>
</div>
<div class="modal-body">
<div class="clearfix">
<!-- START: 00-atomer-07-tekst-02-intro-tekst -->
<p class="a-leadText " id="leadText">Når du passerer 50.000 i omsetning i løpet av en 12 måneders periode må du registrere deg i mva registeret. Dette og skattepliktene dine finner du en oversikt over her.</p>
<!-- END: 00-atomer-07-tekst-02-intro-tekst -->
</div>
</div>
<div class="modal-footer">
<div class="a-btn-group">
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn ">
Skjønner!
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
</div>
</div>
</div>
<div class="modal-content">
<div class="modal-header">
<!--<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>-->
<h4 class="modal-title" id="myModalLabel">5 av 7</h4>
</div>
<div class="modal-body">
<div class="clearfix">
<!-- START: 00-atomer-07-tekst-02-intro-tekst -->
<p class="a-leadText " id="leadText">Hvis du skal ansette folk registrerer du dem her. Her ser du også hvilke plikter du har som arbeidsgiver.</p>
<!-- END: 00-atomer-07-tekst-02-intro-tekst -->
</div>
</div>
<div class="modal-footer">
<div class="a-btn-group">
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn ">
Ok!
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
</div>
</div>
</div>
<div class="modal-content">
<div class="modal-header">
<!--<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>-->
<h4 class="modal-title" id="myModalLabel">6 av 7</h4>
</div>
<div class="modal-body">
<div class="clearfix">
<!-- START: 00-atomer-07-tekst-02-intro-tekst -->
<p class="a-leadText " id="leadText">Det neste det offentlige forventer av deg nå er at du betaler skatt på inntekten din. Dette gjør du 4 ganger i året. Denne fristen og andre kommende oppgaver finner du her.</p>
<!-- END: 00-atomer-07-tekst-02-intro-tekst -->
</div>
</div>
<div class="modal-footer">
<div class="a-btn-group">
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn ">
Skjønner
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
</div>
</div>
</div>
<div class="modal-content">
<div class="modal-header">
<!--<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>-->
<h4 class="modal-title" id="myModalLabel">7 av 7</h4>
</div>
<div class="modal-body">
<div class="clearfix">
<!-- START: 00-atomer-07-tekst-02-intro-tekst -->
<p class="a-leadText " id="leadText">Da er du klar! Vi sender deg en velkomsmelding med en del ressurser og tips. Sjekk den, der finner du mye god hjelp til deg som er nyoppstartet. Lykke til!</p>
<!-- END: 00-atomer-07-tekst-02-intro-tekst -->
</div>
</div>
<div class="modal-footer">
<div class="a-btn-group">
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn a-btn-success ">
Jeg er klar!
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
<!-- START: 00-atomer-03-knapper-10-knapp -->
<button type="button" class="a-btn-link a-textWhite ">
<span>
Ta det en gang til
</span>
</button>
<!-- END: 00-atomer-03-knapper-10-knapp -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: 02-organismer-70-Modal-innhold-40-onboarding-start -->
<!-- START: 02-organismer-01-globale-01-footer -->
<div class="container a-containerFooter">
<!-- Begin Footer -->
<footer class="a-footer ">
<div class="row a-footer-firstRow">
<div class="col-md-4 d-none d-md-block">
<!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->
<div class="form-group a-form-group ">
<label class="a-form-label sr-only " for="text-input-search-11">Søk etter innhold</label>
<div class="a-form-group-items input-group ">
<input class="form-control
a-hasButton " type="search" placeholder="Søk etter innhold" name="input-field" data-val="true" id="text-input-search-11">
<div class="input-group-append">
<button onclick="location.href='/patterns/04-sider-infoportal-40-sok-00-sok-forside/04-sider-infoportal-40-sok-00-sok-forside.html';" class="btn btn-secondary" type="button">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-search " ></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
<span class="sr-only">Søk</span>
</button>
</div>
</div>
</div>
<!-- END: 00-atomer-01-forms-10-tekst-input -->
</div>
<div class="col-md-8">
<nav class="a-footerNav">
<ul>
<li>
<a class="a-hvr-underline" href="/patterns/04-sider-infoportal-10-seksjonsforsider-30-seksjonsforside-v-starteogdrive\04-sider-infoportal-10-seksjonsforsider-30-seksjonsforside-v-starteogdrive.html">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-nw ai-corp "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
starte og drive bedrift
</a>
</li>
<li>
<a class="a-hvr-underline" href="/patterns/04-sider-infoportal-20-navigasjonssider-70-hjelpesenter\04-sider-infoportal-20-navigasjonssider-70-hjelpesenter.html">
<!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
<i class="ai ai-nw ai-phone "></i>
<!-- END: 00-atomer-09-bilder-og-media-15-ikon -->
hjelp og kontakt
</a>
</li>
</ul>
</nav>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<nav class="a-footerExtraNav">
Brønnøysundregistrene,
<span class="a-footerExtraNav-name">8910 Brønnøysund</span>
<div class="a-footerExtraNav-toTop d-md-none">
<a href="#top" class="a-linkArea a-btn ">
Til toppen
</a>
</div>
<ul>
<li><a class="d-none d-md-inline" href="/patterns/04-sider-infoportal-20-navigasjonssider-46-navigasjonsartikkel-v-omaltinn-v2\04-sider-infoportal-20-navigasjonssider-46-navigasjonsartikkel-v-omaltinn-v2.html">Om Altinn</a></li>
<li><a class="" href="/patterns/04-sider-infoportal-20-navigasjonssider-61-arkiv-v-driftsarkiv\04-sider-infoportal-20-navigasjonssider-61-arkiv-v-driftsarkiv.html">Driftsmeldinger</a></li>
<li><a class="" href="/patterns/04-sider-infoportal-30-artikkel-10-artikkel\04-sider-infoportal-30-artikkel-10-artikkel.html">Personvern og cookies</a></li>
</ul>
</nav>
</div>
</div>
</footer>
<!-- End Footer -->
</div>
<!-- END Container -->
<!-- END: 02-organismer-01-globale-01-footer -->
</div>
<!-- END .container -->
</div>
<!-- END .a-page -->
<!-- END: 03-maler-portal-50-innboks-_01-innboks-start-nyoppstartet -->
<!-- END: 04-sider-portal-50-innboks-_01-innboks-start-nyoppstartet -->