* {box-sizing:border-box;}
body, html {height:100%; margin:0; font-family:Arial; overflow-y:hidden; background-color:#FFF;} /* Set height of body and the document to 100% */

/* Style the tab content (and add height:100% for full page content) */
div.contentBox div.tabcontent {background-color:dodgerblue; color:white; display:none; padding:0; height:100%; overflow-y:hidden;}
div.contentBox div.tabcontent iframe {width:100%; height:100%; border:none; margin:0; overflow-y:auto;}

div.linkBox {box-shadow:rgba(0,0,0,.25) 0px -2px 2px; border-top:0px solid #09C; overflow-y:hidden;}
div.linkBox button.tablink {background-color:#FFF; color:#666; float:left; border:none; outline:none; cursor:pointer; padding:6px 0px; font-size:17px; width:33.333%; transition:.1s; text-align:center; position:relative; overflow-x:hidden;}
div.linkBox button.tablink div.bubble {border-radius:50%; background-color:rgba(22,22,22,0.25); opacity:0; padding:0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); transition:.05s; z-index:1;}
div.linkBox button.tablink:active div.bubble {opacity:1; padding:32px;}
div.linkBox button.tablink i.fa {font-size:1.15em; z-index:1;}
div.linkBox button.tablink div.title {font-size:.6em; z-index:1;}

/* mobile(xxs) */
@media screen and (max-width:399px) {
	div.linkBox {padding:0 2.5%;}
}
/* mobile(xs) */
@media screen and (min-width:400px) {
	div.linkBox {padding:0 5%;}
}
/* mobile(sm) */
@media screen and (min-width:576px) {
	div.linkBox {padding:0 10%;}
}
/* tablet(md) */
@media screen and (min-width:768px) {
	div.linkBox {padding:0 20%;}
}
/* laptop(lg), desktop(xl) */
@media screen and (min-width:992px) {
	div.linkBox {padding:0 30%;}
}