/* Head Style */

.Navigator{
    padding: 10px 10px 10px 10px;

    text-align: center;
    position: relative;

    color:#FF9678;

    border: 1px solid rgb(212, 212, 212);
}

.Navigator .backArrow{
    position: absolute;
    left:10px;

    /* vertically center the icon */
    top: 50%; transform: translateY(-50%);

    font-size: 22px;
    color:#FF9678;
    text-decoration: none !important;
}

.packageName{
    font-size: 16px;
    color:black;
    font-weight: bold;
}



/* Package List Body Style */

.packageList{
    text-align: left;
    position: relative;

    min-width:300px;
    max-width:900px;

    padding: 10px 0px 10px 10px;

    margin:10px auto 10px auto;
}

.packageList:hover .taskLink{
    background-color:#FF9678;
    color:white;
}

.packageList:hover .getTask{
    color:white;
}

.packageList:hover{
    background-color:#FF9678;
}

.packageList .getTask{
    position: absolute;
    right:10px;

    text-align: right;

    /* vertically center the icon */
    top: 50%; transform: translateY(-50%);

    font-size: 22px;
    color:#FF9678;
    text-decoration: none !important;
}

.taskLink{
    text-decoration: none !important;
    color:black;
}



/* FlashCard Tasks Style */

.flashCardTaskList{
    text-align: left;
    position: relative;

    min-width:300px;
    max-width:900px;

    padding: 10px 0px 10px 10px;

    margin:10px auto 10px auto;
}

.flashCardTaskList:hover .flashCardLink{
    background-color:#FF9678;
    color:white;
}

.flashCardTaskList:hover .getTaskArrow{
    color:white;
}

.flashCardTaskList:hover{
    background-color:#FF9678;
}

.flashCardTaskList .getTaskArrow{
    position: absolute;
    right:10px;

    text-align: right;

    /* vertically center the icon */
    top: 50%; transform: translateY(-50%);

    font-size: 22px;
    color:#FF9678;
    text-decoration: none !important;
}

.flashCardLink{
    text-decoration: none !important;
    color:black;
}