/* apply a natural box layout model to all elements */
/* http://paulirish.com/2012/box-sizing-border-box-ftw/ */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.chromeframe {position: absolute; top: 0;}



/* GQ FIX
-------------------------------------------------------------------------------*/
#main { display:none;}

/* Vogues FIX
-------------------------------------------------------------------------------*/
#Content {padding-left: 0 !important;}
#ContentNavigation {left: -400px !important;}

/* Glamour FIX
-------------------------------------------------------------------------------*/
.siteWidth {width: 100% !important;}


/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #ccc; color: #fff; text-shadow: none;}
::selection {background: #ccc; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #ccc;} 

ins {background-color: #ccc; color: #000; text-decoration: none;}
mark {background-color: #ccc; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }

/* ======================================== Conde Nast promotion styles ======================================== */

img { border:none;}

.siteWidth {width: 100% !important;}
/*#main { display:none;}*/

/* ========= OVERALL ========= */
.promoclear { clear:both}
.promowrapper a { text-decoration:none; color:#333;}
.promowrapper { font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:14px; height:100%; width:100%; min-width:300px; margin:auto; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

/* ========= CONTENT ========= */
.promologo { text-align:center; margin:30px auto 10px auto; padding:20px; max-width:400px;}

.promocontent { width:100%; height:100%; min-height:1200px; min-width:300px; padding:50px 0px 20px 0px; margin:0px auto 0 auto}

.ie8 .banner { width:100%; overflow:hidden; max-width:970px; min-width:300px; height:250px; border:none; display:block; background-image:url(../img/pandora-IE-970x250.jpg); margin:0 auto 0px auto; image-rendering:optimizeQuality; -ms-interpolation-mode:bicubic;}
.ie8 .supermpu { width:100%; overflow:hidden; max-width:300px; min-width:300px; height:600px; border:none; display:block; background-image:url(../img/pandora-IE-300x600.jpg);margin:0 auto 0px auto; image-rendering:optimizeQuality; -ms-interpolation-mode:bicubic;}
.ie8 .bannerframe1 {  display:none;}
.ie8 .bannerframe2 {  display:none;}
.ie8 .supermpuframe1 {  display:none;}
.ie8 .supermpuframe2 {  display:none;}

:root .banner { background-image:url(../img/pandora-IE-970x250.jpg) \0/IE9; }  /* IE9 */
:root .supermpu { background-image:url(../img/pandora-IE-300x600.jpg) \0/IE9; }  /* IE9 */
:root .bannerframe1 {  display:none \0/IE9;}
:root .bannerframe2 {  display:none \0/IE9;}
:root .supermpuframe1 {  display:none \0/IE9;}
:root .supermpuframe2 {  display:none \0/IE9;}


.banner { width:100%; overflow:hidden; max-width:970px; min-width:300px; height:250px; border:1px solid #333; display:block; background-image:url(../img/pandora970x250_2.jpg); -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;  margin:0 auto 0px auto; image-rendering:optimizeQuality; -ms-interpolation-mode:bicubic;}
.supermpu { width:100%; overflow:hidden; max-width:300px; min-width:300px; height:600px; border:1px solid #333; display:block; background-image:url(../img/pandora300x600_2.jpg); -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; margin:0 auto 0px auto; image-rendering:optimizeQuality; -ms-interpolation-mode:bicubic;}

.bannergallery { text-align:center; max-width:300px; margin:0 auto 0 auto;}
.supermpugallery { text-align:center; max-width:300px; margin:0 auto 0 auto;}

.bannerframe1 { background-image:url(../img/pandora970x250.jpg); background-position:right; width:100%; max-width:968px; min-width:298px; height:248px; text-align:left;}
.bannerframe2 { background-image:url(../img/pandora970x250_2.jpg); background-position:center; float:left; margin:-248px 0 0 0; width:100%; max-width:968px; display:block; height:248px; z-index:2; text-align:center;}

.bannerframe1text1 { margin:45px 0 0 70px; width:320px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

.supermpuframe1 { background-image:url(../img/pandora300x600.jpg); background-position:center; width:100%; max-width:298px; min-width:298px; height:100%; max-height:598px; }
.supermpuframe2 { background-image:url(../img/pandora300x600_2.jpg);  background-position:center; float:left; margin:-598px 0 0 0; width:100%; max-width:300px; display:block; height:598px; z-index:2; text-align:center;}

.supermpuframe1text1 { margin:10px auto 0 auto; width:300px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.supermpuframe1text2 { margin:400px auto 0 auto; width:300px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

.fadeIn {
	opacity:0;
	
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	-o-animation-delay: 0.5s;
	animation-delay: 0.5s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}
.fadeInLeft {
	opacity:0;
	
	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-o-animation-delay: 1s;
	animation-delay: 1s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}
.fadeInRight {
	opacity:0;
	
	-webkit-animation-name: fadeInRight;
	-moz-animation-name: fadeInRight;
	-o-animation-name: fadeInRight;
	animation-name: fadeInRight;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-o-animation-delay: 1s;
	animation-delay: 1s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}

.fadeInLeftAgain {
	opacity:0;
	
	-webkit-animation-name: fadeInLeftAgain;
	-moz-animation-name: fadeInLeftAgain;
	-o-animation-name: fadeInLeftAgain;
	animation-name: fadeInLeftAgain;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 8s;
	-moz-animation-delay: 8s;
	-o-animation-delay: 8s;
	animation-delay: 8s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}
.fadeInRightAgain {
	opacity:0;
	
	-webkit-animation-name: fadeInRightAgain;
	-moz-animation-name: fadeInRightAgain;
	-o-animation-name: fadeInRightAgain;
	animation-name: fadeInRightAgain;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 8s;
	-moz-animation-delay: 8s;
	-o-animation-delay: 8s;
	animation-delay: 8s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}

.fadeInUp {
	opacity:0;
	
	-webkit-animation-name: fadeInUp;
	-moz-animation-name: fadeInUp;
	-o-animation-name: fadeInUp;
	animation-name: fadeInUp;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-o-animation-delay: 1s;
	animation-delay: 1s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}
.fadeInDown {
	opacity:0;
	
	-webkit-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-o-animation-name: fadeInDown;
	animation-name: fadeInDown;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 1.5s;
	-moz-animation-delay: 1.5s;
	-o-animation-delay: 1.5s;
	animation-delay: 1.5s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}

.fadeInUpAgain {
	opacity:0;
	
	-webkit-animation-name: fadeInUpAgain;
	-moz-animation-name: fadeInUpAgain;
	-o-animation-name: fadeInUpAgain;
	animation-name: fadeInUpAgain;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 8s;
	-moz-animation-delay: 8s;
	-o-animation-delay: 8s;
	animation-delay: 8s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}
.fadeInDownAgain {
	opacity:0;
	
	-webkit-animation-name: fadeInDownAgain;
	-moz-animation-name: fadeInDownAgain;
	-o-animation-name: fadeInDownAgain;
	animation-name: fadeInDownAgain;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 8s;
	-moz-animation-delay: 8s;
	-o-animation-delay: 8s;
	animation-delay: 8s;
	
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}

.bounceIn {
	opacity:0;
	
	-webkit-animation-name: bounceIn;
	-moz-animation-name: bounceIn;
	-o-animation-name: bounceIn;
	animation-name: bounceIn;
	
	-webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
		
	-webkit-animation-delay: 6s;
	-moz-animation-delay: 6s;
	-o-animation-delay: 6s;
	animation-delay: 6s;
	
	-webkit-animation-duration: 3s;
	-moz-animation-duration: 3s;
	-o-animation-duration: 3s;
	animation-duration: 3s;
}

.left { width:27%; display:inline-block; float:left; text-align:right; height:250px; padding:80px 0 0 0;}
.leftimg { margin:0 0 0 10px; width:210px;}
.center { width:40%; display:inline-block; height:250px; min-width:300px; text-align:center !important;}
.right { width:27%; display:inline-block; float:right; text-align:left; height:250px; padding:100px 0 0 0;}
.rightimg { margin:0 10px 0 0; width:210px;}

.up { width:240px; display:block; height:120px; padding:0 0 0px 0; margin:40px auto 0 auto;}
.upimg { width:240px;}
.centermpu { width:100%; display:block; height:250px; min-width:300px;}
.down { width:220px; display:block; padding:0 0 0px 0; margin:40px auto 0 auto;}

.banner2 {width:100%; overflow:hidden; max-width:970px; min-width:300px; height:250px; border:1px solid #333; display:none; background-image:url(../img/pandora970x250_2.jpg); -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}


.grid-main > .desk-one-third .widget.advert iframe {
  width:100% !important;
}


/* Media queries 320px
-------------------------------------------------------------------------------*/
@media only screen and (max-width: 300px) {
	
.supermpu { display:block !important;}
.banner2 { width:100%; overflow:hidden; max-width:970px; min-width:300px; height:250px; border:1px solid #333; display:block; background-image:url(../img/pandora970x250_2.jpg); -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

}

/* Media queries 1024px
-------------------------------------------------------------------------------*/
@media only screen and (max-width: 970px) {
	
.supermpu { display:none;}
.banner2 { width:100%; overflow:hidden; max-width:970px; min-width:300px; height:250px; border:1px solid #333; display:block; background-image:url(../img/pandora970x250_2.jpg); -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

}


/* Media queries 768px
-------------------------------------------------------------------------------*/
@media only screen and (max-width: 768px) {


.bannerframe1text1 { margin:105px 0 0 25px; width:250px;}


}



/* Media queries 700px
-------------------------------------------------------------------------------*/
@media only screen and (max-width: 720px) {

.bannergallery { text-align:center; max-width:300px; margin:0px auto 0 auto;}

.left { width:100%; position:relative; float:left; text-align:center; height:20px; padding:0 0 0px 0; z-index:999;}
.leftimg { margin:0 0 0px 0; width:100px;}
.center { width:95%; height:200px; min-width:300px; z-index:-2; text-align:center !important;}
.right { width:100%; height:250px; float:left; text-align:center; margin:-25px auto 0 auto; padding:0 0 80px 0;}
.rightimg { margin:5px 0 0px 0; width:140px}


}


/* Media queries 510px
-------------------------------------------------------------------------------*/
@media only screen and (max-width: 510px) {
/* .supermpu { width:100%; max-width:300px; min-width:300px; border:1px solid #333; background-image:url(../img/pandora300x600_2.jpg); margin:auto;}
.supermpuframe1text1 { margin:5px 0 0 5px; width:140px;}
.supermpuframe1text2 { margin:135px auto 0 auto; width:300px;} */

.bannerframe1text1 { margin:130px 0 0 50px; width:200px;}

/* .supermpuframe2 { background-image:url(../img/pandora300x600_2.jpg); background-position:center; float:left; margin:-248px 0 0 0; width:100%; max-width:298px; display:block; height:248px; z-index:2; } 

.up { width:100%; position:relative; float:left; height:20px; padding:0 0 0px 0; z-index:999; margin:0;}
.upimg { width:100px; margin:0;}
.centermpu { width:100%; display:block; height:250px; min-width:300px; text-align:center !important;}
.down { width:100%; height:60px; margin:-70px auto 0 auto; padding:0 0 0px 0;}
.downimg { margin:0 0 0px 0;} */

}