/*! Bestaamatematik.dk */

/*-- MHN 11-04-2016 --*/
.bestaa-play
{
background-size: cover;
}
.bestaa-play a
{
    display: block;
    width: 95px;
    height: 95px;
    margin: 0 auto;
}


/*---------------------- Navbar ----------------------*/
.navbar
{
    background: #fff;
    padding: 5px 0 10px 0;
    color: #9e9e9e;
    /*box-shadow: 0 0 14px #676767;*/
    margin: 0;
}
.navbar-static-top
{
    border: 0 !important;
}
.navbar ul
{
    margin: 5px 0 0 0;
}
.navbar li a
{
    color: #9e9e9e !important;
}
.navbar li a:hover
{
    color: #000 !important;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover
{
    color: #000 !important;
    background:none !important;
}

/*---------------------- Hero ----------------------*/
.blue
{
    padding: 40px 0 60px 0;
    background: #16a2d8;
}
.blue-time
{
    padding: 50px 0 65px 0;
}
.blue h1
{
    color: #fff;
    margin-bottom: 10px;
}  
.blue-time h1
{
    color: #fff;
    margin-bottom: 10px;
    margin-top: 10px;
} 
.blue p
{
    color: #fff;
    margin: 0;
}
.blue-time p
{
    padding: 0 40px 0 40px;
} 
.blue a
{
    color: #c4efff;
}
.blue a:hover
{
    color: #fff;
    text-decoration: none;
}

.time
{    
    color: #16a2d8;
    background: transparent url(../images/time-icon.png) no-repeat 6px 2px;
    font-size: 40px;
    line-height: 40px;
    font-weight: 300;
    width: 220px;
    padding: 0 0 0 55px;
    text-align: left;
    margin: 60px auto 0 auto;
}
.time-left
{
    margin: 20px 0 0 0 !important;
    background: transparent url(../images/time-icon.png) no-repeat 0 2px !important;
    padding: 0 0 0 49px !important;
}
.time-done
{    
    color: #aaa;
    background: transparent url(../images/time-icon-done.png) no-repeat 6px 2px;
    font-size: 40px;
    line-height: 40px;
    font-weight: 300;
    width: 220px;
    padding: 0 0 0 55px;
    text-align: left;
    margin: 0 auto;
}
.time-ticking
{    
    color: #aaa;
    background: transparent url(../images/time-icon-ticking.png) no-repeat 0 8px;
    font-size: 30px;
    line-height: 30px;
    font-weight: 300;
    width: 160px;
    padding: 5px 0 0 40px;
    text-align: left;
    margin: 0 auto 0 auto;
}


/*---------------------- Common ----------------------*/
/*h1,
h2
{
    font-size: 24px;
    line-height: 30px;
    font-weight: 500;
    margin-bottom: 20px;
    color: #858585;
}
h3
{
    font-size: 18px;
    line-height: 26px;
    color: #16a2d8;    
    font-weight: 400;
    margin-bottom: 5px;
}
h4
{
    margin: 0 0 10px 0;
    font-size: 12px;
}
.center
{
    text-align: center;
}
.uppercase
{
    text-transform: uppercase;
}
.semi-bold
{
    font-weight: 600;
}
.bold
{
    font-weight: 700;
}
.right
{
    text-align: right;
}
.text-big
{
    font-size: 16px;
    line-height: 26px;
}
.orange
{
    background: #f56d4b !important;
}*/



/*---------------------- Box ----------------------*/
.box
{
    border-radius: 4px;
    background: #fff;
    padding: 30px 10px 45px 10px;
    margin-top: 10px;
}
.box-min
{
    min-height: 100%;
}


/*---------------------- Content Box ----------------------*/
.cat-opgave
{
    border-radius: 4px 4px 0 0;
    padding: 25px 0 25px 0;
    margin: 0 0 40px 0;
    text-align: center;
    margin-top: 10px;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    text-transform: uppercase;
}


/*---------------------- USP ----------------------*/
.usp-one
{
    background: #fff url(../images/point1-icon.png) no-repeat 50% 40px;
    padding: 70px 0 30px 0 !important;
}
.usp-two
{
    background: #fff url(../images/point2-icon.png) no-repeat 50% 40px;
    padding: 70px 0 30px 0 !important;   
}
.usp-three
{
    background: #fff url(../images/point3-icon.png) no-repeat 50% 40px;
    padding: 70px 0 30px 0 !important;  
}
.usp-one h3,
.usp-two h3,
.usp-three h3
{
    line-height: 20px;
    margin-bottom: 10px;
}



/*---------------------- Opgave content ----------------------*/
.box-opgave
{
    border-radius: 4px; 
    background: #fff;
    padding: 0 0 5px 0;
    text-align: center;
    margin-top: 10px;
}
/*.box-opgave img
{
    margin: 20px 0 0 0 !important;
}*/

.content-opgave
{
    padding: 10px 20px 0 20px;
}
.pic-text
{
    font-size: 14px;
    font-style: italic;
    margin: 15px auto 0 auto;
    max-width: 60%;
    color: #666;
}
.main-opgave-con
{
    margin: 80px 0 80px 0;
}

.opgave-con
{
    text-align: left;
    max-width: 85%;
    margin: 50px auto 0 auto;
    line-height: 22px;
}
.opgave-con h2
{
    color: #000;
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 0 0 10px 0;
    margin: 0 0 20px 0;
    border-bottom: 1px solid #d8d8d8;
}

.opgave-con .form-control
{
    /*padding:24px 15px 24px 15px !important;*/
    height: 50px;
    margin: 10px 0 0 0;
    background: #e5e5e5;
    border-radius: 2px;
    border-top-right-radius: 2px !important;
    border-bottom-right-radius: 2px !important;
    box-shadow: inset 0 0 0 rgba(0, 0, 0, .075);
    -moz-box-sizing: border-box;
    border-color: #d8d8d8;
    color: #666;
    font-size: 20px;
}

.tips
{
    margin: 20px 0 0 0;
    text-align: center;
    font-size: 14px;
}
.tip-two
{
    margin: 60px 0 0 0;
}
.tips a
{
    color: #24a8dd;        
}
.tips a:hover
{
    color: #1a91bd;
    text-decoration: none;
}

.tip-one
{
    margin: 20px auto 0 auto;
    padding: 20px 8% 30px 8%;
    background: #e9f6fc;
    font-size: 12px;
    max-width: 100%;
    text-align: left;
}
.tip-one h4
{
    font-size: 14px;
    font-weight: 600;
    margin: 20px 0 10px 0;
}
.tip-one .tip-sub
{
    margin: 0 0 50px 0;
}
.tip-one .tip-sub img
{
    margin: 0 !important;
}




/*---------------------- Score grade ----------------------*/
.score
{
    font-size: 60px;
    font-weight: 300;
    text-align: center;
}
.score-header
{
    margin-bottom: 10px;
}
.score-good
{
    color: #53d188;
    padding-bottom: 12px;
}
.score-good-bg
{
    padding-bottom: 12px;
    background: #bee7cb;
}
.score-average
{
    color: #f0bc69;
    padding-bottom: 12px;
}
.score-bad
{
    color: #e67a6e;
    padding-bottom: 12px;
}
.score-bad-bg
{
    padding-bottom: 12px;
    background: #fee9e4;
}

/*-- Score tables 21-04-2015 --*/
.below-average
{
    padding: 2px;
    margin-top: -2px;
    background: #f78773;
    display: inline-block;
    white-space: normal;
    min-width: 20px;
    text-align: center;
    font-size: 10px;
    border-radius: 2px;
    color: #fff;
}
.below-average-text
{    
    color:#f56d4b;
}
.above-average
{
    padding: 2px;
    margin-top: -2px;
    background: #7dd098;
    display: inline-block;
    white-space: normal;
    min-width: 20px;
    text-align: center;
    font-size: 10px;
    border-radius: 2px;
    color: #fff;
}
.above-average-text
{    
    color:#90c695;
}




/*-- TABS and BADGE 21-04-2015--*/
.nav-tabs > li
{
    float: none;
}
.nav-tabs > li > a
{
    font-size: 12px;
    margin-right: 0; 
    margin-bottom: 10px;
}
.badge
{
    font-size: 8px;
    float: right;
}



/*-- TABLES 21-04-2015--*/
.table
{
    font-size: 10px;
    margin-top: 20px;
}
.table > thead > tr > th
{
    font-size: 9px; 
    padding-right: 1px !important;
}
td
{
    padding-top: 20px!important;
    padding-bottom: 20px!important;
    font-size: 10px !important;
    padding-right: 2px !important;
}        
.table > tbody > tr > td:last-child
{
    padding-right: 0 !important;
}

/*-- BTN SMALL TABLES --*/
.table .btn-xs
{
    font-size: 10px !important;
    padding: 2px 1px 1px 1px;
    border-radius: 2px;
    margin-top: -2px;
    white-space: normal;
}



/*---------------------- Categories ----------------------*/
.exam-box
{
    background: #ccc;
}

.indextal
{
    color: #7dd098;
    font-size: 12px;
    margin-top: 0px;
    font-weight: 600;
}
.indextal-box
{
    background: #a4deb7;
}
.geometri
{
    color: #b5c0c1;
    font-size: 12px;
    margin-top: 50px;
    font-weight: 600;
}
.geometri-box
{
    background: #b5c0c1;
}
.ligninger
{
    color: #abdede;
    font-size: 12px;
    margin-top: 50px;
    font-weight: 600;
}
.ligninger-box
{
    background: #abdede;
}
.statistik
{
    color: #c6c2e0;
    font-size: 12px;
    margin-top: 50px;
    font-weight: 600;
}
.statistik-box
{
    background: #c6c2e0;
}
.kapital
{
    color: #acd6f7;
    font-size: 12px;
    margin-top: 50px;
    font-weight: 600;
}
.kapital-box
{
    background: #acd6f7;
}
.lin
{
    color: #7aaeba;
    font-size: 12px;
    margin-top: 50px;
    font-weight: 600;
}
.lin-box
{
    background: #7aaeba;
}
.ekspotionel
{
    color: #eb9696;
    font-size: 12px;
    margin-top: 50px;
    font-weight: 600;
}
.ekspotionel-box
{
    background: #eb9696;
}
.potens
{
    color: #e1d88f;
    font-size: 12px;
    margin-top: 50px;
    font-weight: 600;
}
.potens-box
{
    background: #e1d88f;
}

.no-more-tests /*-- Use this for trial mode, when the user have no more tests in the categori --*/
{
}
.no-more-tests p
{
    color: #d6d6d6;
}
.no-more-tests .cat-box
{
    background-color: #d6d6d6 !important;
}
.no-more-tests .cat-box p
{
    color: #fff !important;
}

.cat-box
{
    color: #fff;
    text-align: center;
    min-height: 100px;
    border-radius: 2px;
    padding: 10px 20px 20px 20px;
    margin-bottom: 14px;
}
.cat-box span
{
    width: 100%;
    display: inline-block;
    font-size: 20px;
    line-height: 20px;
    margin: 10px 0 0 0;
    font-weight: 300;
}
.cat-box .good
{
    font-weight: 700;
}
.cat-box p
{
    line-height: 16px;
}


/*--------------------- Sub Status -------------------------*/

.sub-status
{

    border-radius: 4px;
    padding: 30px 10px 25px 10px;
    margin-top: 10px;
    font-size: 16px;
    color: #fff;
}
.sub-status a
{    
    color: #fff;
}


.sub-status-pro
{ 
    background: #7dd098;
}
.sub-status-trial
{ 
    background: #16a2d8;
}
.sub-status-stop
{ 
    background: #f78773;
}



/*---------------------- Custom stuff ----------------------*/
.dropdown-btn
{
    background:transparent !important;
    padding:0;
    margin: 15px 0 0 0;
    color: #9e9e9e;
    border: 0;
    display: inline-block;
    white-space: nowrap;
}
.dropdown-btn:hover
{
    color: #000;
}
.close-btn
{
    color: #c5c5c7;
    background: #f7f7f9;
}


.back-btn
{
    background: transparent url(../images/arrow-back.png) no-repeat 0 50%;
    padding-left:30px !important;
}

.back-btn-modal
{
    background: transparent url(../images/arrow-back.png) no-repeat 0 50%;
    padding-left:30px !important;
    display: block;
    cursor: pointer;
}

.tab-btn
{
    color: #fff;
    font-size: 14px;
    padding: 15px 20px 15px 20px;
    border-radius: 2px;
    border: 0;
    background: #c8c8c8;
    width: 100%;
}

.cal-btn
{
    margin-top: 10px;
    margin-left: 10px !important;
    font-size: 14px;
    padding: 15px 20px 15px 20px;
    border-radius: 2px !important;
    border: 0;
}
.cal-btn-left /*-- mhn 31-12-2014 --*/
{
    margin-top: 20px !important;
    margin-left: 0 !important;
}
.custom-btn-left
{
    margin: 40px 0 0 0 !important;
}
.custom-btn
{
    margin-top: 40px;
    color: #16a2d8 !important;
    font-size: 14px;
    font-weight: 600;
    padding: 15px 20px 15px 20px;
    border-radius: 2px;
    border:0;
    background: #fff;
    min-width: 218px;
}
.custom-btn:hover
{
    color:#fff;
    background: #eee;
}

.time-btn
{
    margin-top: 20px;
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    padding: 15px 60px 15px 60px;
    border-radius: 2px;
    border: 0;
    background: #16a2d8;
}
.time-btn:hover
{
    color:#fff;
    background: #1493c4;
}
.time-btn-plain
{
    margin-top: 5px;
}


.custom-col
{
    padding-left: 5px;
    padding-right: 5px;
}
.table
{
    font-size: 12px;
    margin-top: 30px;
}
.table > thead > tr > th
{
    font-size: 12px;
}
td
{
    padding-top: 20px!important;
    padding-bottom: 20px!important;    
}
.table > tbody > tr > td:last-child
{
    padding-right: 0 !important;
}



.btn-xs, .btn-group-xs > .btn
{
    padding: 4px 10px 4px 10px;
    margin-top: -4px;
}
.stroke-dashed
{
    border-bottom: 1px dashed #d0d1d5;
    margin: 60px 0 40px 0;
}
.small-container
{
    padding-right:15px;
    padding-bottom: 40px;
    border-bottom: 1px dashed #d0d1d5;
    margin-bottom: 40px;
}

.benefits
{
    list-style: none;
    /*margin: 40px auto;*/
    margin: 20px 0 30px 0;
    padding: 0;
    /*width: 250px;*/
    font-size: 12px;
}
.benefits li
{
    background: transparent url(../images/checkmark.png) no-repeat 0 50%;
    padding: 4px 0 4px 25px;
}

.control-label
{
    text-align: left !important;
}

.form-horizontal
{
    margin:40px 0 0 0; 
}

.dashed-radio
{
    margin: 20px 0 20px 0;
    padding: 5px 0 15px 0;
    border-bottom: 1px dashed #d0d1d5;
    border-top: 1px dashed #d0d1d5;
}
.dashed-picture
{
    margin: 0;
    padding: 20px 0 20px 0;
    border-bottom: 1px dashed #d0d1d5;
    border-top: 1px dashed #d0d1d5;
}
.right-custom
{
    text-align: left;
}
.custom-center
{
    text-align:center;
    padding-top: 10px;
}
.custom-center-time
{
    text-align:center;
}
.input-fullwidth/*-- mhn 31-12-2014 --*/
{
    width: 100%;
}

.radio/*-- mhn 31-12-2014 --*/
{
    margin-top: 15px;
    margin-bottom: 15px;
}


/*---------------------- Footer ----------------------*/
.footer
{
    font-size: 12px;
    margin-top: 20px;
}
.footer a
{
    margin-left: 0;
    margin-top: 0;
}




/*---------------------- Media Queries ----------------------*/
@media (min-width: 992px) {
    h4
    {
        font-size: 14px;
    }    
    .custom-center,
    .custom-center-time
    {
        text-align:left;
    }
    .blue
    {
        padding: 35px 0 35px 0;
    }
    .blue-time p
    {
        padding: 0 100px 0 0;
    }
    .time
    { 
        margin: 20px auto 0 auto;
    }    
    .box-min
    {
        min-height: 215px;
    }
    .box-min-results
    {
        min-height: 272px;
    }
    .stroke-dashed
    {
        margin: 50px 0 20px 0;
    }
    .small-container
    {
        padding-right:60px;
        padding-bottom: 0;
        border-right: 1px dashed #d0d1d5;
        border-bottom: 0;
        margin-bottom: 0;
    }
    .custom-btn-left
    {
        margin: 40px 40px 40px 0 !important;
    }
    .right-custom
    {
        text-align: right;
    }
    .footer a
    {
        margin-left: 10px;
        margin-top: 0;
    }



}
@media (min-width: 768px) {
    .sub-status
    {
        padding: 30px 40px 20px 40px;
    }
    .box
    {
        padding: 30px 40px 45px 40px;
    }
    .box-opgave
    {
        padding: 0 0 5px 0;
    }
    /*-- Categories --*/
    .indextal
    {
        margin-top: 10px;
    }
    .geometri
    {
        margin-top: 10px;
    }
    .ligninger
    {
        margin-top: 10px;
    }
    .statistik
    {
        margin-top: 10px;
    }
    .opgave-con
    {
        max-width: 60%;
    }
    .tip-one
    {
        max-width: 80%;
        padding: 20px 10% 30px 10%;
    }
    .time-plain
    {    
        margin: 10px 0 0 0;
        float: right;
    }
    /*---------------------- USP ----------------------*/
    .usp-one
    {
        padding: 70px 20px 30px 20px !important;
    }
    .usp-two
    {
        padding: 70px 20px 30px 20px !important;   
    }
    .usp-three
    {
        padding: 70px 20px 30px 20px !important;  
    }


    /*-- Score tables 21-04-2015 --*/
    .below-average
    {
        padding: 2px 4px 2px 4px;
        margin-top: -4px;
        background: #f78773;
        display: inline-block;
        white-space: nowrap;
        min-width: 90px;
        text-align: center;
        font-size: 12px;
        border-radius: 4px;
        color: #fff;
    }
    .below-average-text
    {    
        color:#f56d4b;
    }
    .above-average
    {
        padding: 2px 4px 2px 4px;
        margin-top: -4px;
        background: #7dd098;
        display: inline-block;
        white-space: nowrap;
        min-width: 90px;
        text-align: center;
        font-size: 12px;
        border-radius: 4px;
        color: #fff;
    }
    .above-average-text
    {    
        color:#90c695;
    }




    /*-- TABS 21-04-2015--*/
    .nav-tabs > li > a
    {
        font-size: 14px;
        margin-right: 10px;
        margin-bottom: 10px;
        padding: 8px 20px 8px 20px;
        border-radius: 4px;
        float: left;
    }
    .badge
    {
        font-size: 12px;
        float: none;
    }



    /*-- TABLES 21-04-2015--*/
    .table
    {
        font-size: 12px;
        margin-top: 30px;
    }
    .table > thead > tr > th
    {
        font-size: 12px;
    }
    td
    {
        padding-top: 20px!important;
        padding-bottom: 20px!important;
        font-size: 12px !important;
    }
    .table > tbody > tr > td:last-child
    {
        padding-right: 0 !important;
    }    

    /*-- BTN SMALL TABLES --*/
    .table .btn-xs
    {
        font-size: 12px !important;
        padding: 2px 10px 2px 10px;
    }



}