homevar = document.getElementById('home');
homepanevar = document.getElementById('homepane');
servicesvar = document.getElementById('services');
servicespanevar = document.getElementById('servicespane');
portfoliovar = document.getElementById('portfolio');
portfoliopanevar = document.getElementById('portfoliopane');
contactvar = document.getElementById('contact');
contactpanevar = document.getElementById('contactpane');
subport1var = document.getElementById('subportfolio1');
subportpane1var = document.getElementById('subportfoliopane1');
subportanchor1var = document.getElementById('subportfolioanchor1');
subport2var = document.getElementById('subportfolio2');
subportpane2var = document.getElementById('subportfoliopane2');
subportanchor2var = document.getElementById('subportfolioanchor2');
pageouttervar = document.getElementById('page-outter');
pageinnervar = document.getElementById('page-inner');
loadingvar = document.getElementById('loading');

loadingvar.style.width=viewportwidth+'px';
loadingvar.style.height=viewportheight+'px';

function setWidths(){
homevar.style.width=viewportwidth+'px';
servicesvar.style.width=viewportwidth+'px';
portfoliovar.style.width=viewportwidth+'px';
contactvar.style.width=viewportwidth+'px';
subport1var.style.width=viewportwidth+'px';
subport1var.style.left=((viewportwidth)+'px');
subportanchor1var.style.left=((viewportwidth)+'px');
subport2var.style.width=viewportwidth+'px';
subport2var.style.left=((viewportwidth*2)+'px');
subportanchor2var.style.left=((viewportwidth*3)+'px');
pageouttervar.style.width=viewportwidth+'px';
pageinnervar.style.width=(viewportwidth*3+'px');
}

function setHeights(){
homevar.style.height=viewportheight+'px';
homepanevar.style.top=((viewportheight-620)/2+'px');
servicesvar.style.height=viewportheight+'px';
servicespanevar.style.top=((viewportheight-620)/2+'px');
portfoliovar.style.height=viewportheight+'px';
portfoliopanevar.style.top=((viewportheight-620)/2+'px');
contactvar.style.height=viewportheight+'px';
contactpanevar.style.top=((viewportheight-620)/2+'px');
subport1var.style.height=viewportheight+'px';
subportpane1var.style.top=((viewportheight-620)/2+'px');
subport2var.style.height=viewportheight+'px';
subportpane2var.style.top=((viewportheight-620)/2+'px');
pageouttervar.style.height=viewportheight+'px';
}

function decideSizes(){
if (viewportwidth != null){
setWidths();
}
if (viewportheight != null){
setHeights();
}}
window.onload = decideSizes;
