
/* Övrigt, till designen */


html{
	height:100%;
}








a {
    color:#4D8A4D;
    text-decoration: none;

}

#mainCont a {
    /*color:#60A860;
    text-decoration: none;*/
    /*padding:0.1em 0.3em 0.1em 0.3em;*/
    /*background-color: #D6E8D6;*/

}

.btnLink {
    color:#76B476;
    text-decoration: none;
    padding:0.2em 0.2em 0.2em 0.2em;

    border: solid 0.1em #76B476;

}



.inBtn {
    width: auto;
    color:#FFF;
    background-color: #76B476;
    text-decoration: none;
    padding:0.8em;
    text-align: center;
    border-radius: 0.2em;
}

.inLink {
    width: auto;
    color:#FFF;
    background-color: #76B476;
    text-decoration: none;
    padding:0.2em;
    text-align: center;
    border-radius: 0.2em;
}
.inLinkGr {
    width: auto;
    color:#000;
    background-color: rgba(118,180,118,0.5);
    text-decoration: none;
    padding:0.2em;
    text-align: center;
    border-radius: 0.2em;
}

.inBlue {
    background-color: #4475A6;
}
.inRedBtn {

    background-color: #E46545;


}
.inYelBtn {
    color: #000;
    margin-top: 0.3em;
    display:inline-block;
    background-color: #ffd200;


}

.inRed {
    position: relative;
    display: inline-block;
    padding: 0.5em 0.5em 0.5em 5em;
    background-color: #ff1919;
    color: #FFFFFF;
    border-radius: 0.3em;
    font-weight: bold;

}
.inRedStar {
    width: 5em;
    height: 5em;
    position: absolute;
    top:-1.5em;
    left:0;

}
.inWhite {
    background-color: #FFFFFF;
    color:#000;
}
.btnBot {
    position: absolute;
    bottom:1em;
    left:1.5em;
    right: 1.5em;
}

/* Text */
h1{
    font-family: 'Roboto Condensed', sans-serif;
    font-size:2.5em;
    font-weight: normal;
    margin-top:0em;
    margin-bottom:0.7em;
}

h2{
    font-family: 'Roboto Condensed', sans-serif;
    font-size:1.6em;
    font-weight: normal;
    margin-top:0em;
    margin-bottom:0.5em;
}
.h2mt {
    margin-top:2em;
}


h3{
    font-family: 'Roboto Condensed', sans-serif;
    font-size:1.3em;
    font-weight: normal;
    margin-top:1.5em;
    margin-bottom:0.5em;

}


p{
    font-size:1em;
    margin-top:0.5em;
    margin-bottom:1.1em;
    line-height:1.3em;
}

.imageDescribe {
    font-family: 'Roboto Condensed', sans-serif;
    font-size:1.8em;
    font-weight: normal;
    margin-top:2em;
    margin-bottom:0.2em;
    text-align: center;
}
.imageDescribePages {
    position: absolute;
    width: 100%;
    top:1.2em;
    left:0;
    font-family: 'Roboto Condensed', sans-serif;
    font-size:1.2em;
    font-weight: normal;
    margin-top:0em;
    margin-bottom:0.2em;
    text-align: center;
}

.grCk {
  color: #76B476;
}
.chP {
    margin-bottom:0em;
}

.half1 {
    width: 49%;
    margin-right:2%;
    float: left;
}
.half2 {
    width: 49%;
    float: left;
}

.third1 {
    width: 55%;
    margin-right:7%;
    float: left;
}
.third2 {
    width: 38%;
    float: left;
}
.tt {
    padding: 1em;
    width: 25%;
    box-sizing: border-box;
    float: left;
}

.third1 h1 {
    margin-bottom: 0;
}
.third1 h3 {
    margin-top: 0.2em;
    margin-bottom: 1.2em;

}
.c1 {
    color: #76B476;
    font-size:2em;
    line-height: 0.5em;
    padding-right:0.2em;
}
.c2 {
    color: #E46545;
    font-size:2em;
    line-height: 0.5em;
    padding-right:0.2em;
}
.c3 {
    color: #4A8ACA;
    font-size:2em;
    line-height: 0.5em;
    padding-right:0.2em;
}
.smallDescription {
    color: #AAA;
    font-size: 0.8em;
    line-height: 1.2em;
}







/* Layout */

.siteWrap{

    max-width: 1040px; /*Remove to fill screen width */
    margin: 0px auto;
    /*background-color: #F2F2F2;*/
    padding:2em 1em 1em 1em;
}


#siteLogo{
    display: block;
    width:20%;
    float:left;
}
.siteHeader{
    display: block;
    width:80%;
    float:left;
    text-align: right;
    line-height: 2em;
}

.callNum {
    line-height: 2em;
    height: 2em;
    float:right;
    padding-right:0.7em;
    font-size: 1.2em;
}


#headerTop {
    display: block;
    position:relative;
    width:100%;
    min-height:25em;
    background-color: #000;
    background-image: url('/images/webbyra-big.jpg');
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    color:#FFF;
    padding:0em 2em 3em 2em;
    box-sizing: border-box;
}
#headerTopSub {
    position:relative;
    width:100%;
    min-height:3em;
    background-color: #000;
    background-image: url('/images/webbyra-big.jpg');
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    color:#FFF;
    padding:0em 2em 0em 2em;
    box-sizing: border-box;
}


.imageWide {
    width:100%;
    min-height:8em;
    background-color: #000;
    background-image: url('/images/webbyra.jpg');
    background-position: top right;
    background-size: cover;
    background-repeat: no-repeat;
    color:#FFF;
    padding:3em 2em 3em 2em;
    box-sizing: border-box;
}

.siteSpace {
    margin-bottom:2em;
}

.mainInfo {
    text-align: left;
    padding:1em 0em 1em 0em;
}

.boxesHeight {
    display: flex;
}

.link {
    width: 100%;
    height: 100%;
}

.bidstart {
    width: 15%;
}
.descriptionBox {
    flex: 1;
    text-align: left;
    width:31%;
    border:solid 1px #CCC;
    box-sizing: border-box;
    margin-left:3%;
    padding:1.5em 1.5em 1.5em 1.5em;
    background-position: top right;
    background-size: auto 12.9em;
    background-repeat: no-repeat;

}
.dboxStart {
    position: relative;
    padding:1.5em 1.5em 3.5em 1.5em;
}
.descriptionBoxWide {
    text-align: left;
    width:100%;
    border:solid 1px #CCC;
    box-sizing: border-box;
    padding:1.5em 1.5em 1.5em 1.5em;
    background-position: top right;
    background-size: auto 12.9em;
    background-repeat: no-repeat;
    background-image: url('/images/work.png');
}



.firstCol {
    flex: 1;
    text-align: left;
    width:48%;
    border:solid 1px #CCC;
    box-sizing: border-box;
    margin-right:4%;
    margin-top:1.5em;
    padding:1.5em;
    background-position: top right;
    background-size: auto 12.9em;
    background-repeat: no-repeat;
}
.secondCol {
    flex: 1;
    text-align: left;
    width:48%;
    border:solid 1px #CCC;
    box-sizing: border-box;;
    margin-top:1.5em;
    padding:1.5em;
    background-position: top right;
    background-size: auto 12.9em;
    background-repeat: no-repeat;
}


.firstBox {
    margin-left:0%;
}
.descSimple {
    background-image: url('/images/enkla-hemsidor.png');
}
.descPris {
    background-image: url('/images/prisvarda-losningar.png');
}

.descPers {
    background-image: url('/images/personlig-webbyra.png');
}


.descKont {
    background-image: url('/images/kontakt.png');
}
.descWebbshopRod {
    /*background-image: url('/images/webbshop-svart.png');*/
    background-image: url('/images/webbshop.png');
    position: relative;
}
.descWebbshopEtt {
    background-image: url('/images/webbshop-svart.png');
    position: relative;
}
.descWebbshopEtt p, .descWebbshopEtt h2 {
    color:#FFF;
}
.descProj {
    background-image: url('/images/projektledning.png');
}
.descTjanster {
    background-image: url('/images/tjanster.png');
}
.descUppdrag {
    background-image: url('/images/uppdrag.png');
}
.tableRow {
    border-bottom: solid 1px #CCC;
}
.tableOne {
    float: left;
    width: 30%;
    padding: 1.1em 0.7em 0.4em 0em;
    box-sizing: border-box;

}
.tableTwo {
    float: left;
    width: 10%;
    padding: 0.7em 0.7em 0.7em 0em;
    box-sizing: border-box;
}
.tableThree {
    float: left;
    width: 60%;
   padding: 1.4em 0.7em 0.4em 0em;
    box-sizing: border-box;
    font-size: 0.8em;
    color: #333;
}
.headLine {
    border-bottom: solid 1px #000;
    margin-bottom: 0;
}
.headLineGrey {
    border-bottom: solid 1px #ccc;
    margin-bottom: 0;
    padding: 0.5em 0.5em 0.8em 0;
}

.tableInfo {
    padding-top: 0.4em;
    font-size: 0.8em;
}
.okImg {
    width: 2em;
    height: 2em;
}
#seDemo {
    width: 5em;
    height: 5em;
    position: absolute;
    bottom:-1.2em;
    right:-1.2em;
}
.descWebbshop {
    background-image: url('/images/enkel-webbshop.png');
}
.descBef {
    background-image: url('/images/befintlig.png');
}
.descForm {
    background-image: url('/images/formular.png');
}

.descIngar {
    background-image: url('/images/ingar-butik.png');
}
.descWoopris {
    background-image: url('/images/woo-pris.png');
}
.descKonsument {
    background-position: top center;
    background-size: 100%;
    background-image: url('/images/konsument-butik.jpg');
    height: 33em;
}
.descForetag {
    background-position: top center;
    background-size: 100%;
    background-image: url('/images/foretags-butik.jpg');
    height: 33em;
}
.descWooFortnox {
    background-position: top center;
    background-size: 100%;
    background-image: url('/images/woocommerce-fortnox.jpg');
    height: 33em;
}
.descDemo {
    background-image: url('/images/demobutik.png');
}

.descEx {
    background-image: url('/images/exempel-hemsida.png');
}

.descWp {
    background-image: url('/images/worpress-pris.png');
}
.descWpStart {
    background-image: url('/images/wordpress-start-uppdatera.png');
}

.descGratisWebbutikStart {
    background-image: url('/images/gratis-webbutik-webbshop.png');
}
.descWpEtt {
    background-image: url('/images/wordpress-ett.png');
}
.descWpTva {
    background-image: url('/images/wordpress-tva.png');
}
.descWpTre {
    background-image: url('/images/wordpress-tre.png?id=1');
}

.descEnkel {
    background-image: url('/images/enkel-pris.png');
}

.descAv {
    background-image: url('/images/avancerad-hemsida.png');
}

.descAdr {
    background-image: url('/images/webbyra-adress.png');
}
.descTel {
    background-image: url('/images/telefon.png');
}
.descOm {
    background-image: url('/images/om.jpg');
}

.descWp19 {
    background-image: url('/images/wp19.png');
}

.descWp70 {
    background-image: url('/images/wp70.png');
}

.descOff {
    background-image: url('/images/off.png');
}

.descTrafikEtt {
    background-image: url('/images/besokare-till-hemsida.png');
}
.descTrafikTva {
    background-image: url('/images/trafik-till-hemsida-pris.png');
}
.descTrafikTre {
    background-image: url('/images/trafik-till-hemsida-kontakt.png');
}
.descTrafikBesokare {
    background-image: none;
    padding:0em;
}



.boldP {
    margin-bottom:0em;

}





#footer {

    /* box-shadow: 1px 1px 1px #999;*/
    margin:2em auto 0% auto;
    width:100%;
    height:auto;
    /*background-color: #FFF;*/
    box-sizing: border-box;
    background-color: #000;
    color: #FFF;
    font-size: 0.8em;
    box-shadow: 0 50vh 0 50vh #000;
}
#footerWrap{
    position:relative;
    max-width: 1040px; /*Remove to fill screen width */
    margin: 0px auto;
    /*background-color: #F2F2F2;*/
    padding:2em 1em 9em 1em;
}

.footerOne {
    width: 50%;
    float:left;

}
.footerTwo {
    width: 50%;
    float:left;
    text-align: right;
}





.clr {
    clear:both;
    height:0px;
    width:1px;
}

.clr_one {
    clear:both;
    height:1px;
    width:1px;
}


.clr_height {
    clear:both;
    height:25px;
    width:1px;
}



#mobMenuIcon {
    display: none;

}

#mobMenuOver {
    display:  none;
}
#menuOver {
    width: 100%;
    text-align: center;
    position:absolute;
    bottom:0px;
    left:0px;
}

.menuItem {
    display: inline-block;
    padding:2em 1em 1em 1em;
    text-align: center;
    color: #FFF;
    box-sizing: border-box;
    font-weight: normal;
    background-image: url('/images/menuarrow.png');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: contain;
}
.menuItemWebbshop {
    background-image: url('/images/menucart.png');

}

.firstCol {
    width: 50%;
    float:left;
}
.secondCol {
    width: 50%;
    float:left;
}


#webbshopIcon {
    display: none;
}


.hideInMob {
    display:block;
}

.hideInComp {
    display:none;
}





ul {
    margin-top:0.5em;
    padding-left:1em;
}
li {
    margin-top:0.5em;

    text-align: left;
}


.aButton {
    display: block;
    color:#FFF !important;
    padding:0.8em !important;
    background-color: #76B476 !important;
    color: #FFF;
    text-align: center;
}
.aButtonSmall {
    width: 33.3%;
}

.filmButton {
    display: inline-block;
    color:#76B476 !important;
    padding:0.8em !important;
    border: solid 1px #76B476;
    color: #FFF;
    text-align: center;
    margin-top:1em;
}


input, select {
    font-family: myText, sans-serif;
    width: 100%;
    padding:2%;
    border:solid 1px #CCC;
    margin:2% 0% 0% 0%;
    font-size:1em;
    color:#333;
    line-height:1.2em;
    box-sizing: border-box;
}




.fillit {
    border:none;
    width:20px;
    margin-left:-80px;

}
.mycontact {
    overflow:hidden;
    margin-top:-80px;
}




input[type="submit"] {
    width: 100%;
    border:none;
    margin:2% 0% 0% 0%;
    padding:3%;
    font-size:1em;
    line-height:1.2em;
    color:#333;
    box-sizing: border-box;
}

textarea {
    width: 100%;
    padding:2%;
    border:solid 1px #CCC;
    margin:2% 0% 0% 0%;
    color:#333;
    resize: none;
    line-height:1.2em;
    font-family: myText, sans-serif;
    font-size:1em;
    height:6em;
    box-sizing: border-box;
}



img{
    max-width: 100%;
    height: auto;
    width: auto\9;
    display:block;
    border:none;
}
