// =============================================================================
// =============================================================================
// Create elements =============================================================
// =============================================================================
// =============================================================================

// structural
document.createElement("wrap");
document.createElement("container");
document.createElement("header");
document.createElement("sidebar");
document.createElement("footer");

// sidebar
document.createElement("twitter");
document.createElement("rss");
document.createElement("facebook");

//posts
document.createElement("homepage");
document.createElement("posts");
document.createElement("article");
document.createElement("date");
document.createElement("category");
document.createElement("entry");
document.createElement("tags");
document.createElement("nav");

//ads
document.createElement("ads");

// =============================================================================
// =============================================================================
// Resize homepage at load and at vieport change ===============================
// =============================================================================
// =============================================================================

function calculated(postsratio){
    postsratio = (document.body.clientWidth - 461) / 335;
   
    if (postsratio > 3)
     { 
     $('homepage , #earth_hour').css("width" , "1020px" ).fadeIn('slow');
     }
    else if (postsratio > 2)
     {
     $('homepage , #earth_hour').css("width" , "685px" ).fadeIn('slow');
     }
    else if (postsratio > 1)
     {
     $('homepage , #earth_hour').css("width" , "350px" ).fadeIn('slow');
     }
    else if (postsratio < 1) 
     {
     $('homepage , #earth_hour').css("width" , "335px" ).fadeIn('slow');
     }};
     
$(document).ready(calculated);

$(window).resize(calculated);

function calculated2(browserwidth , mincontainerwidth , postthumb , mincommentsh3 , mincommentwidth , topbottommarginleft){
    browserwidth = document.body.clientWidth;
    mincontainerwidth = 480; // most article containers' minimum widths
    postthumb = 140; // the post thumb is the same - 140px - no matter the resolution
    mincommentsh3 = 469; // comments title's minimum width
    mincommentwidth = 359; // actual comments' minimum width
    topbottommarginleft = 385; // scroll to comments minimum margin left
   
    if (browserwidth < 1160)
     { 
     $('body.single wrap container single .post , body.single wrap container single entry , body.single wrap container single entry img , body.single wrap container single comments , ul.commentlist , #search-categories').css({width: mincontainerwidth + 'px' });
     $('body.single wrap container single entry img.thumb').css({width: postthumb + 'px' });
     $('body.single wrap container single comments h3').css({width: mincommentsh3 + 'px' });
     $('ul.commentlist li .comment').css({width: mincommentwidth + 'px' });
     $('#top').css({marginLeft: topbottommarginleft + 'px' });
     }
    else if (browserwidth < 1270)
     {
     $('body.single wrap container single .post , body.single wrap container single entry , body.single wrap container single entry img , body.single wrap container single comments , ul.commentlist , #search-categories').css({width: mincontainerwidth + 200 + 'px' });
     $('body.single wrap container single entry img.thumb').css({width: postthumb + 'px' });
     $('body.single wrap container single comments h3').css({width: mincommentsh3 + 200 + 'px' });
     $('ul.commentlist li .comment').css({width: mincommentwidth + 200 + 'px' });
     $('#top').css({marginLeft: topbottommarginleft + 200 + 'px' });
     }
    else if (browserwidth < 2560)
     {
     $('body.single wrap container single .post , body.single wrap container single entry , body.single wrap container single entry img , body.single wrap container single comments , ul.commentlist , #search-categories').css({width: mincontainerwidth + 200 + 'px' });
     $('body.single wrap container single entry img.thumb').css({width: postthumb + 'px' });
     $('body.single wrap container single comments h3').css({width: mincommentsh3 + 200 + 'px' });
     $('ul.commentlist li .comment').css({width: mincommentwidth + 200 + 'px' });
     $('#top').css({marginLeft: topbottommarginleft + 200 + 'px' });
     }};
     
$(document).ready(calculated2);

$(window).resize(calculated2);