﻿/*
NOTES
body.sitehome = main homepage
body.home = opinions landing page
body.category = opinions landing page for categories
body.debate = opinions debate section
*/


/***********************************************************************styles for desktop view (this was to avoid as many changes to the existing view as possible)*/
#pg-hdr .inner .toggle-mobile-menu { display: none; }


    

/***********************************************************************styles for devices less than 1024 pixels wide*/
@media (max-width: 1024px) {
    
    
    
    /*header ads*/
    div#bodyContainer .headAd { display: none !important; }
    div#bodyContainer .headAd .adcenterinner { display: none !important; }
    
    /*footer ads*/
    #footerAd { display: none; }
    #footerAd .adcenterinner { display: none; }
    
    /*main content 1 ad placement*/
    #Main-Content-1-AdPlacement { width: 100% !important; }
    #taboola-bottom-main-column { width: 100% !important; }
    
    
    /********************************footer*/
    
    
    div#pg-ftr { min-width: 0; width: 100%; position: relative;; }
    div#pg-ftr > .inner { width: 100%; }
    div#pg-ftr > .inner .cf { padding: 0 20px 0 20px; }
    div#pg-ftr > .inner .cf > div { display: block; float: left !important; }
    div#pg-ftr > .inner .cf > .logo { position: relative; top: 0; margin-bottom: 10px; }
    div#pg-ftr > .inner .cf > #ftr-links { padding-left: 0; width: 100%; }
    div#pg-ftr > .inner .cf > #ftr-links > ul { display: block;  margin-bottom: 20px; }
    div#pg-ftr > .inner .cf > #ftr-links > ul > li { margin: 0 0 8px 0; }
    div#pg-ftr > .inner .cf > .social { position: relative; width: 100%; top: 0; float: left; }
    div#pg-ftr > .inner .cf > #valediction { float: left !important; width: 100%; text-align: left !important; margin: 0;  }
    div#pg-ftr > .inner .cf > #valediction #copy { margin-top: 4px; }
    div#pg-ftr > .inner .g-attribution { margin: 0; }
    
   
    
    /*******************************mobile header*/
    
    /*header wrapper & containers*/
    #pg-hdr { min-width: 100% !important; overflow: hidden; position: fixed !important; top: 0; transition: all .5s ease !important; border-bottom: 6px solid #dd6101; }
    #pg-hdr.open { min-height: 300px; height: auto !important; }
    #pg-hdr #pg-hdr-foot { display: none; }
    #pg-hdr .inner { width: 100%; display: block; }
    #pg-hdr .inner .logo { position: relative; float: left; }
    #pg-hdr .inner #menu-container { position: relative !important; top: 0 !important; left: 0 !important; float: left; width: 100% !important;  }
    #pg-hdr .inner #menu-container .menu { width: 100%; margin-bottom: 10px; display: inline-block; width: 100%; }
    
    /*search form*/
    #pg-hdr .inner .fl-r { float: left !important; width: 100% !important; margin: 6px 0 0 6px !important; border: 0 !important; }
    #pg-hdr .inner .fl-r .search { position: relative !important; right: 0 !important; border: 0 !important; padding: 0 !important; width: 280px !important; }
    #pg-hdr .inner .fl-r .search #searchTerm { width: 250px !important; padding: 8px 40px 8px 0 !important; }
    #pg-hdr .inner .fl-r .search #submitSearch { top: 6px !important; right: 0 !important; }
    
    /*sign buttons*/
    #pg-hdr .inner .fl-r .hdr-btn { border: 0 !important; position: relative !important; width: 100% !important; text-align: left !important; left: 5px !important; height: auto !important; }
    #pg-hdr .inner .fl-r .hdr-btn a { color: #fff !important; display: inline-block !important; margin-right: 10px !important; }
    #pg-hdr .inner .fl-r .hdr-btn hr { display: none !important; }
    #pg-hdr .inner .fl-r .hdr-btn img { display: none !important; } 
    
    /*toggle menu button*/
    #pg-hdr .inner .toggle-mobile-menu { display: inline-block; float: right; width: 40px; height: 26px; margin: 10px; background-image: url('/images/toggle-menu.png'); position: relative; top: 12px; right: 8px; }
    
    /*bubble menu - triggered by orange arrows*/
    #pg-hdr .inner .bubble { left: 0 !important; right: 0; margin-left: auto; margin-right: auto; top: 10%; height: 200px; overflow: auto; }

    /*user account*/
    #pg-hdr .inner #menu-container .menu .imageOut { margin-left: 10px; }
    #pg-hdr .inner #acctMenu { display: inline-block !important; position: relative; top: 0; right: 0; border: 0; box-shadow: 0; width: 100%; box-shadow: none; }
    #pg-hdr .inner #acctMenu .acct-box { background: none; border: 0; padding: 0; position: relative; }
    #pg-hdr .inner #acctMenu .acct-box h3 { display: none; }
    #pg-hdr .inner #acctMenu .acct-box > ul { display: inline-block; }
    #pg-hdr .inner #acctMenu .acct-box > ul > li > a { color: #fff; }
    #pg-hdr .inner #acctMenu .acct-box .sign-out { position: relative; top: -20px; left: 20px; right: 0; margin: 6px 0 0 6px; } 
    #pg-hdr .inner #acctMenu #note-box { display: none; }
    
    
    
}



/***********************************************************************styles for devices less than 768 pixels wide*/
@media (max-width: 768px) { }



/***********************************************************************styles for devices less than 500 pixels wide*/
@media (max-width: 500px) { }