/*
Theme Name: Basic
Theme URI: http://www.mysupernova.com
Author: Jonathan Darouze
Version: 3.0
Description: Theme to be used for the basic Google + packages
*/



@import url("style.php");

/* 200px / 16px = 12.5em - 399px / 16px = 24.9375em */
@media only screen and (min-width: 12.5em) and (max-width: 24.9375em) {
.hide {display: none;}
#wrap {width: 95%;}



#textlogo {width:80% !important;}

#textlogo span.logo1 {font-size: 2.25em !important; }
#textlogo span.logo2 {font-size: 1.75em !important; }
#textlogo span.logo3 {width:100% !important;}

#content {width: 100%;}
#sidebar {width: 100%;}

#slogan {margin: 0 0 0 0; font-size: 1.5em !important; }
#motto {margin: 0 0 0 0; font-size: 1em !important; }

.one_half {width: 100% !important; margin: 1% 0 !important; float: none !important;}
.one_half_last {width: 100% !important; margin: 1% !important; float: none !important;}
.two_thirds {width: 100% !important; margin: 1% 0 !important; float: none !important;}
.two_thirds_last {width: 100% !important; margin: 1% 0 !important; float: none !important;}
.one_third {width: 100% !important; margin: 1% 0 !important; float: none !important;}
.one_third_last {width: 100% !important; margin: 1% 0 !important; float: none !important;}

#vcardside img {width: auto !important; margin: 0 0 0 0; padding: 0 0 9px 0; clear: none; display: inline; background: none;}
.shadow {width: 90%;}
#footer {width: 91%;}
#sliderwrap {-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#slides {display: none;}
#slideside {width: 98%; padding: 1%;}
#vcardside .nottitle {margin: 1% 0; padding: 2% 0; font-size: 1.1em; font-weight: bold; background: #ffffff url('images/titlegrad-light.png') repeat;}
#firstcoupon, #lastcoupon {width: 98%; margin: 2% 0; padding: 1%; float: left; background: none;}
#youtube .image {width: 90%; font-size: .8em;}


#contentfullhome .box {width: 100%; float: none; margin: 0 0; clear: none;}
#contentfullhome .boxmid {width: 100%; float: none; margin: 4% 0; clear: none;}
}

/* 400px / 16px = 25em - 599px / 16px = 37.9375em */
@media only screen and (min-width: 25em) and (max-width: 37.4375em) {
.hide {display: none;}
#wrap {width: 90%;}


#textlogo {width:75% !important;}

#textlogo span.logo1 {font-size: 2.75em !important; }
#textlogo span.logo2 {font-size: 2em !important; }

#textlogo span.logo3 {width:70% !important;}

#content {width: 100%;}
#sidebar {width: 100%;}

#slogan {margin: 0 0 0 0; font-size: 1.5em !important; }
#motto {margin: 0 0 0 0; font-size: 1em !important; }

#vcardside img {width: auto !important; margin: 0 0 0 0; padding: 0 0 9px 0; clear: none; display: inline; background: none;}
.shadow {width: 90%;}
#footer {width: 91%;}
#sliderwrap {-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#slides {display: none;}
#slideside {width: 98%; padding: 1%;}
#vcardside .nottitle {margin: 1% 0; padding: 2% 0; font-size: 1.1em; font-weight: bold; background: #ffffff url('images/titlegrad-light.png') repeat;}
#youtube .image {width: 90%; font-size: 1.3em;}
#side-widget {width: 70%; }


#contentfullhome .box {width: 100%; float: none; margin: 0 0; clear: none;}
#contentfullhome .boxmid {width: 100%; float: none; margin: 4% 0; clear: none;}
}

/* 600px / 16px = 37.5em - 799px / 16px = 49.9375em */
@media only screen and (min-width: 37.5em) and (max-width: 49.9375em) {
.hide {display: none;}
#wrap {width: 90%;}



#textlogo {width:95% !important;}
#textlogo span.logo3 {width:40% !important;}


#content {width: 100%;}
#sidebar {width: 100%;}

#vcardside img {width: auto !important; margin: 0 0 0 0; padding: 0 0 9px 0; clear: none; display: inline; background: none;}
.shadow {width: 90%;}
#footer {width: 91%;}
#sliderwrap {-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#slides {display: none;}
#slideside {width: 98%; padding: 1%;}
#vcardside .nottitle {margin: 1% 0; padding: 2% 0; font-size: 1.1em; font-weight: bold; background: #ffffff url('images/titlegrad-light.png') repeat;}
#youtube .image {width: 90%; font-size: 1.3em;}


#slogan {margin: 0 0 0 0; font-size: 1.5em !important; }
#motto {margin: 0 0 0 0; font-size: 1em !important; }

#contentfullhome .box {width: 100%; float: none; margin: 0 0; clear: none;}
#contentfullhome .boxmid {width: 100%; float: none; margin: 4% 0; clear: none;}
#side-widget {width: 50%; }
#bbb {width:65%; margin: 0 auto; }
}

/* 800px / 16px = 50em - 1099px / 16px = 68.6875em */
@media only screen and (min-width: 50em) and (max-width: 68.6875em) {
.hide {display: none;}
#wrap {width: 94%;}

#textlogo {width:75% !important;}
#textlogo span.logo3 {width:40% !important;}

#vcardside img {width: auto !important; margin: 0 0 0 0; padding: 0 0 9px 0; clear: none; display: inline; background: none;}
#vcardside-home .email, .email2 {font-size:85%;}
.shadow {width: 94%;}
#footer {width: 94%;}
#sliderwrap {-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#slides {display: none;}
#slideside {width: 98%; padding: 1%;}
#vcardside .nottitle {margin: 1% 0; padding: 2% 0; font-size: 1.1em; font-weight: bold; background: #ffffff url('images/titlegrad-light.png') repeat;}

}

/* 1100px / 16px = 68.75em - 1199px / 16px = 74.9375em */
@media only screen and (min-width: 68.75em) and (max-width: 74.9375em) {
#wrap {width: 1075px;}
.shadow {width: 95%;}
#footer {width: 1075px;}
#vcardside .contents {margin: 2% 0;}
#vcardside .buttons {margin-top: 0}
#vcardside .nottitle {margin: 2% 0; padding: 1% 0;}
#vcardside .titles {padding-top: 0; padding-bottom: 0;}

#textlogo {width:75% !important;}
#textlogo span.logo3 {width:40% !important;}

}

/* 1200px / 16px = 75em - 1399px / 16px = 87.4375em */
@media only screen and (min-width: 75em) and (max-width: 87.4375em) {
#wrap {width: 1075px;}
.shadow {width: 80%;}
#footer {width: 1075px}
#vcardside .nottitle {margin: 3% 0; padding: 2% 0;}
#vcardside .titles {padding-top: 1%; padding-bottom: 1%;}
#vcardside .nottitle {margin: 2% 0; padding: 1% 0;}
#vcardside .titles {padding-top: 1%; padding-bottom: 1%;}

#textlogo {width:75% !important;}
#textlogo span.logo3 {width:40% !important;}

}

/* 1400px / 16px = 87.5em - 1599 / 16px = 99.9375em */
@media only screen and (min-width: 87.5em) and (max-width: 99.9375em) {
#wrap {width: 1075px;}
.shadow {width: 71%;}
#footer {width: 1075px}
#vcardside .nottitle {margin: 3% 0; padding: 2% 0;}
#vcardside .titles {padding-top: 1%; padding-bottom: 1%;}

#textlogo {width:75% !important;}
#textlogo span.logo3 {width:40% !important;}

}

/* 1600px / 16px = 100em - 1799 / 16px = 112.4375em */
@media only screen and (min-width: 100em) and (max-width: 112.4375em) {
#wrap {width: 1075px;}
.shadow {width: 61%;}
#footer {width: 1075px}
#vcardside .nottitle {margin: 2% 0; padding: 1% 0;}
#vcardside .titles {padding-top: 0%; padding-bottom: 0%;}

#textlogo {width:75% !important;}
#textlogo span.logo3 {width:40% !important;}

}

/* 1800px / 16px = 112.5em - 1999 / 16px = 124.9375em */
@media only screen and (min-width: 112.5em) and (max-width: 124.9375em) {
#wrap {width: 1075px;}
.shadow {width: 60%;}
e
#vcardside .nottitle {margin: 3% 0; padding: 2% 0;}
#vcardside .titles {padding-top: 1%; padding-bottom: 1%;}

#textlogo {width:75% !important;}
#textlogo span.logo3 {width:40% !important;}

}

/* 799px / 16px = 49.9375em */
@media only screen and (max-width: 49.9375em) {
/* -- Mobile Menu -- */
#mobile-nav {width: 100%; height: auto; margin: 0 0 0 0 !important; clear: both; position: inherit !important; top: 0 !important; right: 0 !important; background: #ffffff url('images/body.png') repeat;}
#mobile-nav #toggle-view {width: 100%; list-style:none; margin: 0 0 0 0 !important; padding: 0;}
#mobile-nav #toggle-view li {list-style:none; border-bottom: none !important; position: relative; cursor:pointer;}
#mobile-nav #toggle-view h3 {width: 60% !important; margin: 2% 0 2% 20%; padding: 1% 0 !important; text-align: center; clear: both; cursor: pointer; text-shadow: 1px 1px 1px #000000; filter: dropshadow(color=#000000, offx=1, offy=1); color: #ffffff; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9); -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9); -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9);}
#mobile-nav #toggle-view .panel {margin: 0 0 0 0 !important; padding: 2% 0 0 0 !important; display:none; overflow: hidden; background: #999999 url(images/texture_transperant.png) repeat; box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.9); -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.9); -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.9);}
#nav {position: absolute !important; top: -9999px !important; left: -9999px !important;}

#mobile-nav .menu-main-container {width: 98% !important; margin: 0 auto;}
#mobile-nav .menu li {width: 49% !important; float: left; margin: 0 .5% 2% .5% !important; text-align: center !important;}
#mobile-nav .menu a {width: 100% !important; height: auto; margin: 0 0 2% 0 !important; padding: 4% 0 !important; font-weight: bold; font-size: 1.2em; line-height: normal; background: #ffffff url(images/titlegrad-button.png) repeat-x center; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); text-shadow: none; filter: none;}
#mobile-nav .menu ul {width: auto; margin: 0 0 0 0; display: block; position: inherit; z-index:1001; border: none; text-align: left;}
#mobile-nav .menu ul li {width: 100% !important; margin: 0 0 0 0 !important;}
}

/* 240px / 16px = 15em - 799px / 16px = 49.9375em */
@media only screen and (min-width: 15em) and (max-width: 49.9375em) {

/* -- Footer -- */
#footer {width: 90%; }
#footercontent .copyright {width: 100% !important; font-size: .9em; float: left; text-align: center; margin: 0;}
#footercontent .design {width: 100% !important; font-size: .9em; color: #333333; text-align: center !important; float: right;}