﻿/*Top Menu section*/

@media all and (max-width: 720px)
{

    .topmenu_area
    {
        float: none;
        display: table;
        margin: 0 auto;
    }

    ul.navigation li
    {
        height: 37px !important;
    }

    .InnerFrame_part_of_graphic_subject
    {
        width: auto !important;
    }

    .textalign2
    {
        font-size: 16px !important;
        font-weight: bold !important;
    }

    #innerbody_fotter
    {
        width: 100% !important;
    }

    .fb-like-box iframe[style]
    {
        width: 100% !important;
    }


    /* To fill the container and nothing else */

    .fb-page-container
    {
        width: 260px !important;
    }
    
    .fb-like
    {
        display:inline-block !important;
    }
    
    #fotter
    {
        background-size: auto 100%;
    }

    .linkSubjectItem
    {
        display: block !important;
        width: 100% !important;
        border-bottom: 1px solid #000;
        padding: 10px 0;
        height:auto !important;
    }
    
    #pnlSubject.roundedCorners
    {
        padding:0 !important;
    }
    
    .roundedCorners
    {
        padding:0 !important;
    }
    
    #datalst > br
    {
        display:none;
    }

    .TheLineBetweenTheTopSubjectsList
    {
        display: none !important;
    }

    #datalst
    {
        overflow: scroll;
        height: auto;
    }

    .UserDefinedSubjectItem
    {
        width: 25% !important;
    }

    #cssmenu
    {
        border-radius: 10px;
        background-color: #0F4982;
    }
    
    .ListOfSubjectsOfPesonalLinksAtTop
    {
        background-color:#fff;
        float:none !important;
    }
  
   
    /*.LinkMidFrame
        {
            width:70% !important;
        }*/
}

@media all and (max-width: 855px)
{
    .search_menu_banner
    {
        height: 160px;
    }

    #myFrame
    {
        height: auto;
    }
}

@media all and (max-width: 910px)
{
    .left
    {
        display: none;
    }

    .right
    {
        width: 100% !important;
    }

    .wrlpLinks
    {
        width: 100% !important;
    }

    .userLinksMidFrame
    {
        width: 100% !important;
    }
}

@media all and (min-width: 1225px)
{
    body
    {
        /*background-size:100% 18.3%;*/
    }
}

@media all and (min-width: 1075px)
{
    .siteWidth
    {
        width: 88%;
    }
}

@media all and (max-width: 500px)
{
    #innerbody_area
    {
        padding: 25px 0 0;
        display:block;
    }
    
    .siteWidth
    {
        width: 95%;
    }

    .imgResponsive
    {
        max-width: 100%;
        display: block;
        width: 100%;
    }

    .imgResponsiveButton
    {
        background-size: auto 100%;
        height: auto !important;
        line-height: 20px;
        white-space: normal;
    }

    .NewlnkMidFrameStyle
    {
        width:48% !important; /* Fallback if Unsupported calc(), (96 / 2 = 48), need to add this because on window safari calc() is not supporting */
        width: -webkit-calc(96% / 2) !important; /** Safari 6, Chrome 19-25 **/
        width: -moz-calc(96% / 2) !important; /** FF 4-15  **/
        width: calc(96% / 2) !important; /*Note: As we are use boxes for each link then to manage Floating Divs At Variable Heights need to set width with help of calc() function */ 
        /*if you want to change width then I advice to change divition part only to 3,4,5 (So this divition part works as columns want in single row) */
    }

    /* Note: If you will change width of the .NewlnkMidFrameStyle class then you need to update following css style to set Divs as Variable Heights */
    /* for exmple you changed width to calc(96% / 4) then need to update following style with nth-child(4n+1) */
    .NewlnkMidFrameStyle:nth-child(2n+1)
    {
        clear: both !important;
    }
    
}

@media all and (min-width: 499px) and (max-width: 720px)
{
 .NewlnkMidFrameStyle
    {
        width:32% !important; /* Fallback if Unsupported (96 / 3 = 32), need to add this because on window safari calc() is not supporting */
        width: -webkit-calc(96% / 3) !important; /** Safari 6, Chrome 19-25 **/
        width: -moz-calc(96% / 3) !important; /** FF 4-15  **/
        width: calc(96% / 3) !important;
    }
    
    /* Note: If you will change width of the .NewlnkMidFrameStyle class then you need to update following css style to set Divs as Variable Heights */
    /* for exmple you changed width to calc(96% / 4) then need to update following style with nth-child(4n+1) */
    .NewlnkMidFrameStyle:nth-child(3n+1)
    {
        clear: both !important;
    }
    
     #cssmenu #menu-button::before
    {
        right:42px !important;
    }
    
    #cssmenu #menu-button::after
    {
        right:42px !important;
    }
} 

/*End top Menu section*/