/*===================================================================================================================================*/
/* --------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------ UNIFLIP PAGE ------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------------------------------- */
/*===================================================================================================================================*/
.mainbodytable td.mainbodytablemiddle{
    padding: 0 0 0 0;
}

.mainbodytable td.mainbodytablemiddle td{
    /*padding: 0 !important;*/ /* Uncomment this when go to production. */
}

.home-block{
    width: 100%;
    /*display: table;*/
    padding-top: 15px;
}

.home-block.gray{
    background-color: #F5F5F5;
}

.home-block.centered{
    text-align: center;
}

.dark-orange {
    background: -webkit-linear-gradient(#f8992c,#f68a1f) !important;
    background: -o-linear-gradient(#f8992c,#f68a1f) !important;
    background: -moz-linear-gradient(#f8992c,#f68a1f) !important;
    background: linear-gradient(#F3BD7F,#f68a1f) !important;
}

a.dark-orange:hover {
    background: -webkit-linear-gradient(#f68a1f,#f8992c) !important;
    background: -o-linear-gradient(#f68a1f,#f8992c) !important;
    background: -moz-linear-gradient(#f68a1f,#f8992c) !important;
    background: linear-gradient(#f68a1f,#f8992c) !important;
}

.dark-blue {
    background: -webkit-linear-gradient(#284C8C,#1D3766) !important;
    background: -o-linear-gradient(#284C8C,#1D3766) !important;
    background: -moz-linear-gradient(#284C8C,#1D3766) !important;
    background: linear-gradient(#284C8C,#1D3766) !important;
}

a.dark-blue:hover {
    background: -webkit-linear-gradient(#1D3766,#284C8C) !important;
    background: -o-linear-gradient(#1D3766,#284C8C) !important;
    background: -moz-linear-gradient(#1D3766,#284C8C) !important;
    background: linear-gradient(#1D3766,#284C8C) !important;
}

div.home-block.home-slider{
    margin-left: 0px !important;
    margin-top: -87px !important;
}

div.bxslider div h1, 
div.bxslider div h2, 
div.bxslider div h3, 
div.bxslider div h4, 
div.bxslider div h5, 
.home-sliderflip-1 a, .home-sliderflip-2 a, .home-sliderflip-3 a{
    position: absolute;
    font-family: Arial, Helvetica, sans-serif;      
    padding: 0;
    margin: 0;
}

div.bxslider div{
    /*lwft:5px;*/
}

.bx-wrapper .bx-controls-direction a{
    z-index: 7999 !important;
}

.home-sliderflip-1 a, .home-sliderflip-2 a, .home-sliderflip-3 a{
    text-decoration: none;
}

.home-sliderflip-1 a:hover, .home-sliderflip-2 a:hover, .home-sliderflip-3 a:hover{
    text-decoration: underline;
}


/* --------------------------------------------------------------------------------- */
/* ---------------------------- SLIDER MODIFICATIONS 1 ----------------------------- */
/* --------------------------------------------------------------------------------- */

.bx-wrapper .bx-pager.bx-default-pager a{
    background: #eee !important;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active{
    background: #1c3664 !important;
}

div.bx-point-container{
    background-color: rgba(28,54,100,0.5);
    width: 445px;
    height: 155px;
    position: absolute;
    display: block;
}

div.bxslider div.bx-point-container h3{
    font-size: 16px !important;
    color: white !important;
    font-weight: lighter !important;
}

div.bxslider div.bx-point-container .h3-1 {
    left: 10px !important;
    top: 10px !important;
}

div.bxslider div.bx-point-container .h3-2 {
    left: 10px !important;
    top: 37px !important;
}

div.bxslider div.bx-point-container .h3-3 {
    left: 10px !important;
    top: 66px !important;
}

div.bxslider div.bx-point-container .h3-4 {
    left: 10px !important;
    top: 94px !important;
}

div.bxslider div.bx-point-container .h3-5 {
    left: 10px !important;
    top: 122px !important;
}

/* --------------------------------------------------------------------------------- */
/* ------------------------------------ SLIDE 1 ------------------------------------ */
/* --------------------------------------------------------------------------------- */

div.bxslider div.home-sliderflip-1 h1,
div.bxslider div.home-sliderflip-1 h2,
div.bxslider div.home-sliderflip-1 h3,
div.bxslider div.home-sliderflip-1 h4{
    color: white;
    text-align: left;
    font-weight: normal;
}

div.bxslider div.home-sliderflip-1 h1 {
    font-size: 37px;
    text-shadow:-1px -1px 0 rgba(28,54,100,100), 1px 1px 0 rgb(28, 54, 100);
}

div.bxslider div.home-sliderflip-1 h2 {
    font-size: 19px;
    font-weight:500 !important;
    text-shadow:-1px -1px 0 rgba(28, 54, 100, 0.2), -1px 1px 0 rgba(28, 54, 100, 0.2), 1px -1px 0 rgba(28,54,100,0.2), -1px 1px 0 rgba(28,54,100,0.2);
}

div.bxslider div.home-sliderflip-1 h3 {
    font-size: 17px;
    font-weight:lighter !important;
}

div.bxslider div.home-sliderflip-1 h4 {
    font-size: 11px;
}

div.bxslider div.home-sliderflip-1 h1.h1-1 {
    left: 50px;
    top: 37px;
    font-weight: 600;
    width:625px;
    
}

div.bxslider div.home-sliderflip-1 h2.h2-1 {
    left: 50px;
    top: 75px;
    right:400px;
    line-height:26px;
}

div.bxslider div.home-sliderflip-1 h2.h2-2 {
    left: 50px;
    top: 120px;
}

div.bxslider div.home-sliderflip-1 h2.h2-3 {
    left: 50px;
    top: 150px;
}

div.home-sliderflip-1 div.bx-point-container{
    top: 185px;
    left: 60px;
    width:420px !important;
}

div.bxslider div.bx-point-container h3.glyphicons i{
    padding: 0 30px 0 0;
}

div.bxslider div.bx-point-container h3.glyphicons i:before{
    color: whitesmoke;
    font-size: 13px;
    
}


div.bxslider div.home-sliderflip-1 h4.h4-1 {
    width: 110px;
    left: 875px;
    top: 50px;
    font-style: italic;
    letter-spacing:1px;
    line-height:14px;
}

/* --------------------------------------------------------------------------------- */
/* ------------------------------------ SLIDE 2 ------------------------------------ */
/* --------------------------------------------------------------------------------- */



div.bxslider div.home-sliderflip-2 h2{
    color: #444;
    text-align: left;
    font-weight: normal;
}

div.bxslider div.home-sliderflip-2 h4,
div.bxslider div.home-sliderflip-2 h5{
    color: white;
    text-align: left;
    font-weight: normal;
}

div.home-sliderflip-2 div.bx-point-container{
    top: 170px;
    left: 60px;
}

div.bxslider div.home-sliderflip-2 h2 {
    font-size: 37px;
}
/*
div.bxslider div.home-sliderflip-2 h3 {
    font-size: 18px;
}*/

div.bxslider div.home-sliderflip-2 h4 {
    font-size: 16px;
}

div.bxslider div.home-sliderflip-2 h5 {
    font-size: 17px;
}

div.bxslider div.home-sliderflip-2 h2.h2-1 {
    left: 50px;
    top: 30px;
    font-weight: 600;
    color:#1c3664;
    width:500px;
    text-shadow:0px -1px 0 rgba(255, 255, 255, 0.7), 1px 1px 0 rgba(255,255,255,0.7), -1px 1px 0 rgba(255,255,255,0.7), 0.1px 1px 0 rgba(255,255,255,0.7);
}

div.bxslider div.home-sliderflip-2 h3.h3-1 {
    left: 50px;
    top: 75px;
}

div.bxslider div.home-sliderflip-2 h4.h4-1 {
    left: 75px;
    top: 150px;
}

div.bxslider div.home-sliderflip-2 h4.h4-2 {
    left: 75px;
    top: 175px;
}

div.bxslider div.home-sliderflip-2 h4.h4-3 {
    left: 75px;
    top: 200px;
}

div.bxslider div.home-sliderflip-2 h4.h4-4 {
    left: 75px;
    top: 225px;
}

div.bxslider div.home-sliderflip-2 h4.h4-5 {
    left: 75px;
    top: 250px;
}

div.bxslider div.home-sliderflip-2 h4.h4-6 {
    left: 75px;
    top: 275px;
}

div.bxslider div.home-sliderflip-2 h4.h4-7 {
    left: 75px;
    top: 300px;
}

div.bxslider div.home-sliderflip-2 h4.h4-8 {
    left: 270px;
    top: 150px;
}

div.bxslider div.home-sliderflip-2 h4.h4-9 {
    left: 270px;
    top: 177px;
}

div.bxslider div.home-sliderflip-2 h4.h4-10{
    left: 270px;
    top: 203px;
}

div.bxslider div.home-sliderflip-2 h4.h4-11{
    left: 270px;
    top: 227px;
}

div.bxslider div.home-sliderflip-2 h4.h4-12{
    left: 270px;
    top: 251px;
}

div.bxslider div.home-sliderflip-2 h5.h5-1{
    left: 270px;
    top: 290px;
    font-style: italic;
}

/* --------------------------------------------------------------------------------- */
/* ------------------------------------ SLIDE 3 ------------------------------------ */
/* --------------------------------------------------------------------------------- */

div.bxslider div.home-sliderflip-3 h2{
    color: #1c3664;
    text-shadow:0px -1px 0 rgba(255, 255, 255, 0.7), 1px 1px 0 rgba(255,255,255,0.7), -1px 1px 0 rgba(255,255,255,0.7), 0.1px 1px 0 rgba(255,255,255,0.7);
}

div.bxslider div.home-sliderflip-3 h3,
div.bxslider div.home-sliderflip-3 h4{
    color: white;
    text-align: left;
    font-weight: normal;
}

div.home-sliderflip-3 div.bx-point-container{
    top: 190px;
    left: 485px;
    width:445px !important;
}

div.bxslider div.home-sliderflip-3 h2 {
    font-size: 36px;
}

div.bxslider div.home-sliderflip-3 h3 {
    font-size: 19px;
}

div.bxslider div.home-sliderflip-3 h4 {
    font-size: 20px;
}

div.bxslider div.home-sliderflip-3 h2.h2-1 {
    width: 470px;
    left: 490px;
    top: 75px;
    font-weight: 600;
}


div.bxslider div.home-sliderflip-3 h4.h4-1 {
    width: 301px;
    left: 86px;
    top: 74px;
    text-align: center;
}

div.bxslider div.home-sliderflip-3 h4.h4-2 {
    width: 301px;
    left: 86px;
    top: 98px;
    text-align: center;
}

div.bxslider div.home-sliderflip-3 a.trial,
div.bxslider div.home-sliderflip-3 a.demo{
    left: 132px;
    text-align: center !important;
    color: #fff;
    padding: 10px 25px;
    box-shadow: 0 0 1px #333;
    width: 160px;
    font-size: 18px;
    text-shadow:1px 1px 0 #1c3664;

    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 5px;
  
}

div.bxslider div.home-sliderflip-3 a.trial {
    top: 180px;
}


div.bxslider div.home-sliderflip-3 a.demo {
    top: 250px;
}


/* --------------------------------------------------------------------------------- */
/* ------------------------------------- TRIAL ------------------------------------- */
/* --------------------------------------------------------------------------------- */
/*div.bxslider > a.trial {
    display: none;
}*/

span.under-trial{
    position: relative;
    top: 510px;
    left: 800px;
    color: #1c3664;
    font-style: italic;
    font-size: 12px;
    width: 165px;
    display: block;
    text-align: center;
    line-height:16px;
}

div.home-block  a.trial2{
    text-decoration: none;
    text-align: center !important;
    font-weight:bold !important;
    letter-spacing:1px;
    color: #fff;
    padding: 20px 15px 15px 20px;

    position: relative;
    top: 502px;
    left: 790px;
    width: 150px;
    z-index: 999;
    display: block;

    font-size: 19px;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 5px;
    text-shadow:1px 1px 0 #1c3664;
/*
    -webkit-box-shadow: 3px 3px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    3px 3px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         3px 3px 5px 0px rgba(50, 50, 50, 0.75);   */ 
}

div.home-block > a.trial2 i{
    float: right;
    position: relative;
    display: block;
    opacity: 0.5;
}

div.home-block > a.trial2 i:before{
    color: white;
    padding: 0;
    margin: 0;
    line-height: 17px;
    font-size: 21px;
}

div.home-slider div.bx-pager.bx-default-pager a.trial { 
    display: block;
    text-align: center !important;
    color: #fff;
    padding: 7px 30px;
    box-shadow: 0 0 1px #333;

    text-indent: initial;
    position: absolute;
    top: 30px;
    right: 5px;
    width: initial;
    height: initial;

    -ms-transform: translateY(-50%); 
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}  


a.trial3{
    text-decoration: none;
    text-align: center !important;
    color: #fff;
    padding: 15px 10px 15px 10px;

    position: relative;
    z-index: 999;
    display: block;

    font-size: 19px;
    letter-spacing:1px;
    font-weight:600;


    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 5px;
    text-shadow:1px 1px 0 #1c3664;

    -webkit-box-shadow: 3px 3px 5px 0px rgba(50, 50, 50, 0.15);
    -moz-box-shadow:    3px 3px 5px 0px rgba(50, 50, 50, 0.15);
    box-shadow:         3px 3px 5px 0px rgba(50, 50, 50, 0.15);    
}

a.trial3 i{
    float: right;
    position: relative;
    display: block;
    opacity: 0.5;
}

a.trial3 i:before{
    color: white;
    padding: 0;
    margin: 0;
    line-height: 17px;
    font-size: 21px;
}
/* --------------------------------------------------------------------------------- */
/* ---------------------------------- SECOND BOX ----------------------------------- */
/* --------------------------------------------------------------------------------- */

#block-2{
    height: 285px;
}

#block-2 h2 {
    text-transform: uppercase;
    text-align: left;
    margin-left: 50px;
    font-weight: 600;
    font-size: 25px;
    margin-top: 90px;

    color: #1c3664;

    background: -webkit-linear-gradient(#ccc, #1c3664);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing:1px;

}

#block-2 h3 {
    text-transform: uppercase;
    text-align: left;
    margin-left: 120px;
    font-weight: 600;
    letter-spacing:1px;
    font-size: 36px;
    margin-top: 10px;
    margin-bottom: 30px;

    color: #FF9212;

    background: -webkit-linear-gradient(#FDB048, #FF9212);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.step-box {
    width: 252px;
    height: 85px;
    margin-right: -4px;
    display: inline-block;
    clear: both;  
    padding: 10px 3px;
    vertical-align: top;
}



div.homeflip-margin {
    padding-top: 50px;
}


div.homeflip-margin-15 {
    padding-top: 15px;
}

div.homeflip-no-margin {
    padding-top: 0px;
}

div.home-block div.step-box span.step-title {
    color: white;
    float: left;
    font-size: 25px;
    text-transform: uppercase;
    margin-top: 5px;
}

div.home-block div.step-box span.step-subtitle {
    color: white;
    float: left;
    font-size: 16px;
    padding-bottom: 10px;
    padding-top:5px;
}

div.home-block div.step-box p.step-text {
    padding: 5px 0px 0px 10px;
    font-size: 13px;
    float: left;
    text-align: center;
    color: #1c3664;
    margin-left:-15px;
}

div.home-block div.step-box img.inner-img {
    float: left;
}


/*Boxflip 1*/
.home-boxflip-1{
    background-image: url(../../../images/front-page-2016/step-bg.png);   
    background-repeat: no-repeat;
}

div.home-block div.home-boxflip-1 img.inner-img {
    max-width: 40px;
    max-height: 67px;
    padding: 5px 10px;
}

/*Boxflip 2*/
.home-boxflip-2{
    background-image: url(../../../images/front-page-2016/step-middle.jpg);   
    background-repeat: no-repeat;
    padding: 10px 20px;
    width: 211px;
}

div.home-block div.home-boxflip-2 img.inner-img {
    max-width: 53px;
    max-height: 53px;
    margin: 10px 10px 0 0;
}

/*Boxflip 3*/
.home-boxflip-3{
    background-image: url(../../../images/front-page-2016/step-middle.jpg);   
    background-repeat: no-repeat;
    padding: 15px 20px;
    width: 207px;
}

/*Boxflip 4*/
.home-boxflip-4{
    padding: 0px 5px;
    width: 50px;
}

/*Boxflip 5*/
.home-boxflip-5{
    padding: 0px 5px 0px 30px;
    margin-top: -50px;
    width: 160px;
    margin-right:-30px;
}

div.home-block div.home-boxflip-3 img.inner-img {
    max-width: 40px;
    max-height: 40px;
    margin: 10px 10px 0 0;
}

a.publish{
    text-decoration: none;
    text-align: left !important;
    color: blue;
    padding: 4px 30px 7px 0px;
    margin-top: 6px;
    z-index: 999;
    text-transform: uppercase;
    font-size: 11px;
    margin-left: -31px;

  /*  -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

    -webkit-box-shadow: 3px 3px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    3px 3px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         3px 3px 5px 0px rgba(50, 50, 50, 0.75);    */
}

a.publish i{
    float: right;
    position: relative;
    display: block;
    margin-left: 10px;
}

a.publish i:before{
    color: blue;
    padding: 0;
    margin: -3px -2px;
    line-height: 10px;
    font-size: 17px;
}

a.publish:hover,
a.publish:hover i,
a.publish:hover i:before{
    color: orange;
}
/* --------------------------------------------------------------------------------- */
/* ----------------------------------- THIRD BOX ----------------------------------- */
/* --------------------------------------------------------------------------------- */

#block-3{
    padding: 30px 0px 30px 0px;
}

.experience-box:first-child{
    border-right: 1px solid #CCC;
}

.experience-box {
    width: 45%;
    margin-right: -4px;
    display: inline-block;
    clear: both;  
    padding: 0 20px;
    vertical-align: top;
}

.experience-box .step-title{
    float: left;
    padding: 10px;
    font-weight:600;
    font-size: 19px;
    color: #1c3664;

}

.experience-box img{
    float: left;
    clear: left;
    padding: 30px 10px 0px 0px;

}

.experience-box p.step-text{
    float: left;
    padding: 0px 10px 5px 10px;
    font-size: 13px;
    color: #1c3664;
    width: 250px;
    text-align: left;
    line-height: 20px;
    margin: 0 !important;
}



/* --------------------------------------------------------------------------------- */
/* ---------------------------------- FOURTH BOX ----------------------------------- */
/* --------------------------------------------------------------------------------- */

#block-4{
    background-image: url(../../..//images/uf2014/front-page/march-2015/responsive-epub.gif);   
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    
    padding:20px 10px 0px 0px;
}

#block-4 h2 {
    text-align: left;
    margin-left: 50px;
    font-weight: 600;
    font-size: 25px;

    color: #1c3664;

    background: -webkit-linear-gradient(#ccc, #1c3664);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing:1px;
  text-transform:uppercase;

}

#block-4 h3 {
    text-align: left;
    margin-left: 120px;
    letter-spacing:1px;
    font-weight: 600;
    font-size: 36px;
    margin-top: 10px;
    margin-bottom: 30px;

    color: #FF9212;

    background: -webkit-linear-gradient(#FDB048, #FF9212);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

div.ribboned .wrap-ribbon.right-corner{
    top: 58px;
    right: -22px;
    transform: scale(0.65) rotate(45deg);
}

div.ribboned .wrap-ribbon.left-corner{
    top: 58px;
    left: -22px;
    transform: scale(0.65) rotate(-45deg);
}

div.ribboned .wrap-ribbon.left-edge{
    top: 16px;
    left: -24px;
    transform: scale(0.65) rotate(90deg);
}

div.ribboned .wrap-ribbon.right-edge{
    top: 0;
    right: -24px;
    transform: scale(0.65);
}

div.ribboned .wrap-ribbon span,
div.ribboned .wrap-ribbon a{
    color: white;
    font-size: 17px;
    font-weight: bold;
    line-height: 42px;
    text-transform: uppercase;
    text-decoration: none;
}

div.ETR-html5{
    /*background-image: url(../../../grafiske-filer-transport/uniflip_files_18_12_15/images/html-seal.png);   
    background-repeat: no-repeat;
    background-position: center;*/
    background-color: #7CABE4;

    left: 80px;
    top: 0px;
    position: relative;
    display: table;
    height: 90px;
    width: 200px;
    color: white;
}

div.ETR-html5.ribboned{
    width: 250px;
}

div.ETR-html5 p{
    width: 125px;
    padding: 5px 0px 0 60px;
    text-align: left;
    margin: 0;
    font-size:12px;
    line-height:17px;
    letter-spacing:1px;
    text-shadow:1px 1px #1c3664;
}

div.ETR-html5 p.mtop{
    margin-top: 4px;

    /*width:180px;*/
    margin-left:0px !important;
    position:;
    
}

div.ETR-html5 p.mbottom{
    margin-left: 0px !important;
    position: absolute;


}


div.ETR-html5 p.html5-info{
    position: absolute;
    right: 8px;
    top: -8px;
    width: auto;
    padding: 0;
    cursor: pointer;
}

div.ETR-html5 p b{
    font-size: 16px;
}

div.ETR-html5 p.html5-info i:before{
    color: orange;
    font-size: 28px;
    text-shadow: none;
}

div.ETR-html5 img{
    position: absolute;
    top: 20px;
    left: 4px;
    width: 45px;
}

div.ETR-google{
    background-image: url(../../../grafiske-filer-transport/uniflip_files_18_12_15/images/google-seal.png); 
    background-repeat: no-repeat;
    background-position: center top;

    left: 120px;
    top: 20px;
    position: relative;
    display: table;
    height: 90px;
    width: 130px;
    color: white;
}

div.ETR-google p{
    width: 100%;
    margin: 0;
    color: #1c3664;
    padding: 35px 0 0 0;
    text-align: center;
    font-size: 13px;
    line-height:18px;
}



div.ETR-browsers{
    background-image: url(../../../images/front-page-2016/browsers.jpg);   
    background-repeat: no-repeat;
    background-position: center bottom;

    left: 700px;
    top: -235px;
    position: relative;
    display: table;
    height: 95px;
    width: 180px;
    color: white;
}

div.ETR-browsers p{
    width: 100%;
    margin: 0;
    color: #1c3664;
    padding: 0 0 0 0;
    text-align: center;
    font-size: 13px;
    line-height:16px;
    font-weight:lighter;
}

div.ETR-cms{
    background-image: url(../../../images/front-page-2016/cms-systems.jpg);   
    background-repeat: no-repeat;
    background-position: center bottom;

    left: 700px;
    top: -207px;
    position: relative;
    display: table;
    height: 108px;
    width: 180px;
    color: white;
}

div.ETR-cms p{
    width: 175px;
    margin: 0;
    color: #1c3664;
    padding: 0 0 0 0;
    text-align: center;
    font-size: 13px;
    line-height:16px;
    font-weight:lighter;
}

div.ETR-links{
    width: 100%;
    position: relative;
    top: -160px;
}

div.ETR-links a{
    margin: 0 15px;
}

a.click_to_view{
    text-decoration: none;
    text-align: left !important;
    color: blue;
    padding: 7px 25px 7px 7px;

    z-index: 999;

    font-size: 15px;
}

a.click_to_view:hover,
a.click_to_view:hover i,
a.click_to_view:hover i:before {
    color: orange;
}

a.click_to_view i{
    float: right;
    position: relative;
    display: block;
    margin-left: 10px;
    margin-right:-10px;
}

a.click_to_view i:before{
    color: blue;
    padding: 0;
    margin: 0;
    line-height: 10px;
    font-size: 18px;
}

div.ETR-bar{
    background-color: #77A7E0;
    padding: 25px 0px;
    min-height: 40px;
    top: -146px;
    position: relative;
    float: left;
    width: 100%;
}

div.ETR-bar span{
    float: left;
    color: white;
    font-size: 17px;
    font-family:Helvetica, Arial, sans-serif;
    margin-top: 10px;
}
div.ETR-bar span.hp-xtra-ml{
    margin-left: 150px;
}
div.ETR-bar span.hp-xtra-ml-dk{
    margin-left: 50px;
}
div.ETR-bar span.hp-xtra-ml-de{
    margin-left: 80px;
}

div.ETR-bar span.dot{
    margin: 2px 5px 0 12px;
}

div.ETR-bar span.dot i:before{
    color: white;
    padding-top:3px;
}

div.ETR-bar a{
    float: right;
    margin: -5px 35px 0 40px;
}


div.ETR-bar .big-play{
    position: absolute;
    left: 175px;
    margin-top: 0px;
}

div.ETR-bar .big-play i:before{
    color: white;
    font-size: 30px;
}


/* --------------------------------------------------------------------------------- */
/* ----------------------------------- FIFTH BOX ----------------------------------- */
/* --------------------------------------------------------------------------------- */

#block-5 {
    margin-top: -150px;
    padding-top: 30px;
    float: left;
    padding-bottom:30px;
}

#block-5 h2 {
    text-align: left;
    margin-left: 40px;
    font-weight: bold;
    font-size: 25px;

    color: #1c3664;

    background: -webkit-linear-gradient(#ccc, #1c3664);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#block-5 h3 {
    text-align: left;
    margin-left: 120px;
    letter-spacing:1px;
    font-weight: 600;
    font-size: 35px;
    margin-top: 10px;
    margin-bottom: 10px;

    color: #FF9212;

    background: -webkit-linear-gradient(#FDB048, #FF9212);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#block-5 .inspired-box{
    background-color: white;
    /*background-image: url(../../../grafiske-filer-transport/uniflip_files_18_12_15/images/icon-boxes-bg.png);   */
    background-repeat: no-repeat;
    background-position: bottom -10px right 0px;
    min-height: 245px;
    width: 196px;
    padding-bottom: 10px;
    float: left;
    margin: 15px 0px 15px 40px;
    position: relative;

    -webkit-box-shadow: 7px 7px 24px 0px rgba(50, 50, 50, 0.55);
    -moz-box-shadow:    7px 7px 24px 0px rgba(50, 50, 50, 0.55);
    box-shadow:         7px 7px 24px 0px rgba(50, 50, 50, 0.55);
}


.inspired-box .step-title{
    float: left;
    padding: 5px 0;
    font-size: 19px;
    color: orange;
    width: 100%;
}

.inspired-box span.glyphicons{
    float: left;
    clear: left;
    padding: 0;
    margin: 15px 0 5px;
    width: 100%;
    text-align: center;
}

.inspired-box span.glyphicons i{
    color: #BDBDBD;
}

.inspired-box span.glyphicons i:before{
    color: #BDBDBD;
    font-size: 34px;
    position: relative;
}

.inspired-box p.step-text{
    float: left;
    padding: 0 15px;
    font-size: 13px;
    color: #1c3664;
    width: 165px;
    text-align: center;
    margin: 0;
    line-height:17px;
}

.inspired-box p.step-text a{
    font-size: 13px;
    text-decoration: underline;
    color: #1c3664;
    padding-top: 5px;
}

.inspired-box p.step-text a:hover{
    text-decoration: none;
}

/* --------------------------------------------------------------------------------- */
/* ----------------------------------- SIXTH BOX ----------------------------------- */
/* --------------------------------------------------------------------------------- */

#block-6 {
    padding-top: 30px;
    float: left;
}

#block-6 h2 {
   text-transform: uppercase;
    text-align: left;
    margin-left: 50px;
    font-weight: 600;
    font-size: 25px;
    margin-top: 10px;

    color: #1c3664;

    background: -webkit-linear-gradient(#ccc, #1c3664);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing:1px;
}

#block-6 h3 {
    text-align: left;
    margin-left: 150px;
    font-weight: 600;
    font-size: 35px;
    margin-top: 5px;
    margin-bottom: 20px;

    color: #FF9212;

    background: -webkit-linear-gradient(#FDB048, #FF9212);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#block-6 div.ETR-bar{
    top: 20px;
}

#block-6 div.ETR-bar a.centered-start{
    transform: translateX(-50%);
    position: relative;
    display: block;
    float: none;
    width: 200px;
    left: 50%;
    margin: 0;
}


#block-6 div.ETR-bar a#back-top-front{
    position: absolute;
    padding: 20px;
    display: block;
    right: 25px !important;;
    margin: 0;
    top: 20%;
    /*top: 50%;
    transform: translateY(-50%);*/
    background-color: #1c3664;
    -webkit-border-radius: 50% !important; 
    -moz-border-radius: 50% !important;
    border-radius: 50% !important;
}

#block-6 div.ETR-bar a#back-top-front i:before{
    color: white;
    font-size: 20px;
    padding: 10px;
}

#block-6 div.ETR-bar a#back-top-front-txt{
    position: absolute;
    display: block;
    right: 0px important;
    margin: 0;
    top: 70%;
    font-size: 11px;
    width: 100px;
    padding-left:870px;
    text-align:right;
}



/* --------------------------------------------------------------------------------- */
/* ---------------------------------- SEVENTH BOX ---------------------------------- */
/* --------------------------------------------------------------------------------- */

#block-7 {
    background-color: #F5F5F5;
    height: 45px;
    float: left;
    padding: 0 !important;
    margin: 0 !important;
}

/*FlipBlock 2*/
div.home-block.flip-block2 {
    max-width: 100%;
    margin: 0 auto;
}

    /*Right content*/
    div.home-block div.flip-block2-left{
        width: 46%;
        border-radius: 5px;
        /* box-shadow: 0px 0px 1px #333; */
        display: inline-block;
        float: left;
        padding: 10px;
        margin: 10px 0 10px 10px;
    }
        div.flip-block2-left div.flip-block2-uniflip-frame {
            height: auto;
        }

        div.flip-block2-left div.block2-uniflip-mag1 {
            float: left;
            position: relative;
            width: 222px;
            height: 260px;
            background-color: green;
        }
            div.block2-uniflip-mag1 img {
                width: 222px;
                height: 260px;
                float: left;
                overflow: hidden;
                transition: all 0.3s ease-in-out;
            }

            div.block2-uniflip-mag1 img:hover {
                transform: scale(1.025);
                cursor: pointer;
            }

        div.flip-block2-left div.block2-uniflip-mag2 {
            float: left;
            position: relative;
            width: 222px;
            height: 260px;
            margin-left: 6px;
            background-color: green;
        }
            div.block2-uniflip-mag2 img {
                width: 222px;
                height: 260px;
                float: left;
                overflow: hidden;
                transition: all 0.3s ease-in-out;
            }

            div.block2-uniflip-mag2 img:hover {
                transform: scale(1.025);
                cursor: pointer;
            }

    /*Left content*/
    div.home-block div.flip-block2-right{
        width: 45%;
        display: inline-block;
        border-radius: 5px;
        /* box-shadow: 0px 0px 1px #333; */
    }
        div.flip-block2-right div.flip-block2-text {
            height: auto;
            /* margin-bottom: 30px; */
            margin: 20px 10px;
        }

        div.flip-block2-right h2 {
            height: auto;
            font-size: 18px;
            margin-bottom: 20px;
            color: #424242;
        }

        div.flip-block2-right p {
            font-size: 12px;
            color: #424242;
        }

        div.flip-block2-right div.devices-btn ul {
            display: inline-block;
            list-style: none;
            text-decoration: none;
            padding: 0;
            margin: 0;
        }

            div.devices-btn {
                margin: 10px;
                //text-align: center;
            }

            div.devices-btn a {
                width: 300px;
                height: 50px;
                text-decoration: none;
                border-top-right-radius: 5px;
                border-bottom-right-radius: 5px;
                background-color: #eee;
                float: left;
                margin-bottom: 10px;
                transition: all 0.3s ease-in-out;
            }

            div.devices-btn a:hover {
                background-color: #ddd;
            }

            div.devices-btn a.screen-btn img {
                float: left;
            }

            div.devices-btn a.screen-btn p {
                font-size: 14px;
                text-align: left;
                padding: 15px 10px 0 50px;
                margin: 0;
            }

/*FlipBlock 3*/
div.home-block div.flip-block3 {
    width: 30%;
    display: inline-table;
    margin: 20px 1% 10px 1%;
    min-height: 365px;
    background-color: #eeeeee;
    text-align: center;
}
    .flip-block3 h2{
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        width: 100%;
        margin: 20px auto;
    }
    .flip-block3 img,
    .flip-block3 .text-block{
        display: inline-block;
        vertical-align: top;
    }
    .flip-block3 img{
        height: 190px;
        margin: 20px auto 25px;
    }
    .flip-block3 .text-block{
        max-width: 100%;
        text-align: left;
        padding: 0 10px;
        min-height: 155px;
    }
    .flip-block3 .text-block p{
        padding: 0 5px 10px 5px;
        margin: 0 0 10px 0;
    }
    a.flip-block3-btn{
        font-size: 14px;
        text-decoration: none;
        color: white;
        padding: 5px 10px;
        
        border: 1px white solid;
         -webkit-border-radius: 3px !important; 
         -moz-border-radius: 3px !important;
         border-radius: 3px !important;


        background: -webkit-linear-gradient(#6388c5,#3861aa) !important;
        background: -o-linear-gradient(#6388c5,#3861aa) !important;
        background: -moz-linear-gradient(#6388c5,#3861aa) !important;
        background: linear-gradient(#6388c5,#3861aa) !important;
    }

    a.flip-block3-btn:hover{
        color: white;
        
        background: -webkit-linear-gradient(#3861aa,#6388c5) !important;
        background: -o-linear-gradient(#3861aa,#6388c5) !important;
        background: -moz-linear-gradient(#3861aa,#6388c5) !important;
        background: linear-gradient(#3861aa,#6388c5) !important;
    }

/*FlipBlock 4*/
.flip-block4{
    width: 100%;
    display: inline-table;
    text-align: center;
}
.flip-block4 h2{
    font-size: 18px;
    font-weight: 700;
    max-width: 100%;
    text-align: center;
    padding: 10px 20px 0 20px;
}
    .flip-block4-container{
        width: 90% !important;
        display: block;
        margin: 0 auto 20px !important;
        text-align: center;
        padding-bottom: 30px;
    }

    .flip-block4-container div.bx-viewport{
        padding: 20px 0 40px;
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
    }

    .flip-block4-container .bx-wrapper img{
        margin-left: 10px;
        margin-right: 10px;
        display: inline-block !important;
    }


    .flip-block4-container .bx-wrapper ul li{
        margin-left: 25px;
    }



.uniflip-tooltip{
    background-color: white; 
    padding:10px; 
    width:200px; 
    font-size:12px; 
    border: 1px solid black; 
    border-radius:3px; 
    -moz-border-radius:3px; /* Firefox */ 
    -webkit-border-radius:3px; /* Safari y Chrome */ 
}

div#responsive_landingpage .hpadding {
    height: 27px;
    float: left;
    background-color: #F5F5F5;
    padding: 0 !important;
    margin: 0 !important;
}


#top_line_footer_container{
    padding-top: 15px !important;
}

#top_line_footer_container,
div.footer{
   /* background-color: #F5F5F5 !important;*/
}

@media (min-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */ #top_line_header, #middle_line_header{ width: 100% !important;}}
@media (min-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ #top_line_header, #middle_line_header{ width: 100% !important;}}
@media (min-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ #top_line_header, #middle_line_header{ width: 100% !important;}}
@media (min-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */ #top_line_header, #middle_line_header{ width: 1000px !important;}}
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ #top_line_header, #middle_line_header{ width: 1000px !important;}}
@media (min-width:1281px) { /* hi-res laptops and desktops */ #top_line_header, #middle_line_header{ width: 1000px !important;}}