﻿@media only screen and (max-width: 1050px) {  
	.veganlogo { display: none; }
	.section1 .veganlogo { display: block; }
	.section1 { padding-left: 20px; }
	.section3 .middle .inner .span3 { width: 278px; }
}

/*  ipad portrait */
@media only screen and (min-width: 768px) and (max-width: 984px) {
	.royalSlider.wear.large { display: none; }
	.royalSlider.wear.med { display: block; }
	.inner{ margin:0 0 0 2%; width:96% }
	.logobar ul li{ width:31%; margin-left: 0; padding-right: 2%; padding-top:0px; font-size:21px; line-height: 2em; }
	.logobar ul li span{ margin-top:2px; width:35px; height:33px; padding-top:2px; font-size:24px; line-height: 1.4em; }

	.header-social{ display:none}
	.section1 .inner .left{ width:80%; height:auto}
	.section1 { overflow: hidden; }
	.section2 .header .inner h1{ font-size:31px;}
	.section2 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.social-right{ display:none}
	.slider1-inner{ overflow:hidden; width: 670px; margin: 20px auto; }
	.slider1-inner div.first{ margin-left:52px;}
	.section2 .footer{ padding-top:15px; line-height: 2em; font-size:18px;}
	.section3 .header .inner h1{ font-size:31px;}
	.section3 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.section4 .header .inner h1{ font-size:31px;}
	.section4 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.section3 .middle .inner .span3{ margin:58px auto 0; float:none}
	.section3 .middle .inner .span3 span.check{ display:inline-block}
	.section3 .middle .inner .span3 span.label{ display:inline-block}
	.section3 .middle .inner .span3 span.search{ display:inline-block}
	.section3 .footer .inner div{ display:none}
	.section3 .middle .inner .span2{ width:auto}
	.section3{ height:auto}
	.section3 .middle{ height:auto}
	.section3 .middle .inner .span2 ul li{ float:none; height:auto; margin:0; width:auto; border:none}
	.section3 .middle .inner .span2 ul{ max-width: 50%; height:auto; padding:50px 0 20px}
	.section3 .middle .inner .span2{ height:auto}
	.section2 .header .inner p, .section3 .header .inner p, .section4 .header .inner p { font-size:16px;}
	.section4 .footer .inner .sheep { display: none; }
	.section5{ height:auto}
	.slider2-prev, .slider2-next{ display:none}
	.slider1-prev, .slider1-next{ display:none}
	.signup-box div button{ width:100px;}
	.signup-box div input{ width:200px;}
	.signup-box{ width:auto}
	.section4{ height:auto;}
	.section4 .footer{ padding-bottom:20px;}
	.slider1{ width:50%; margin:0 auto}
	.section5 .inner h1{ font-size:46px; line-height:61px;}
	.section5 .inner h2{ font-size: 50px;}
	.signup-box div{ width:95%}
	#footer .inner ul li{ float:none; border:none; text-align:center}
	.footer a { -webkit-transition: color .5s ease-in; -moz-transition: color .5s ease-in; -ms-transition: color .5s ease-in; -o-transition: color .5s ease-in; transition: color .5s ease-in; }
}

/*  ipad landscape*/
@media only screen and (min-width: 600px) and (max-width: 767px) {
	.royalSlider.wear.large { display: none; }
	.royalSlider.wear.small { display: block; }
	.inner{ margin:0 0 0 2%; width:96% }
	.logobar ul li { min-height:30px; padding-top:13px; font-size:17px; margin:10px 0; float:left; width: 31%; margin-right: 2%; margin-top: 0; }
	.logobar ul li span{ margin-top:-6px; width:35px; height:33px; padding-top:2px; font-size:24px}
	.header-social{ display:none}
	.section1 .mask { margin-left: -10%; }
	.section1 .inner .left{ width:80%; height:auto}
	.section1 .inner .left h2{ font-size:23px; margin-top:10px; line-height:33px;}
	.section1 .inner .left h2 span{ font-size:38px;}
	.section1 .inner .left p { max-width: 75%; font-size: 18px; line-height: 1.4em; }
	.section2 .header .inner h1{ font-size:31px;}
	.section2 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.social-right{ display:none}
	.slider1-inner{ overflow:hidden; width: 289px; margin: 20px auto;}
	.section2 .footer{ padding-top:15px; height:60px; font-size:18px;}
	.section3 .header .inner h1{ font-size:31px;}
	.section3 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.section4 .header .inner h1{ font-size:31px;}
	.section4 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.section3 .middle .inner .span3{ margin:58px auto 0; float:none}
	.section3 .middle .inner .span3 span.check{ display:inline-block}
	.section3 .middle .inner .span3 span.label{ display:inline-block}
	.section3 .middle .inner .span3 span.search{ display:inline-block}
	.section3 .footer .inner div{ display:none}
	.section3 .middle .inner .span2{ width:auto}
	.section3{ height:auto}
	.section3 .middle{ height:auto}
	.section3 .middle .inner .span2 ul li{ float:none; height:auto; margin:0; width:auto; border:none; font-size:14px}
	.section3 .middle .inner .span2 ul{ width:278px; height:auto; padding:50px 0 20px}
	.section3 .middle .inner .span2{ height:auto}
	.section2 .header .inner p, .section3 .header .inner p, .section4 .header .inner p{ font-size:15px;}
	.section5{ height:auto}
	.slider2-prev, .slider2-next{ display:none}
	.slider1-prev, .slider1-next{ display:none}
	.signup-box div button{ width:100px;}
	.signup-box div input{ width:200px;}
	.signup-box{ width:auto; height:auto; padding-bottom:10px;}
	.section4{ height:auto;}
	.section4 .footer{ padding-bottom:20px;}
	.slider1{ width:50%; margin:0 auto}
	#toggle_menu{ float:right; background:#47CDD7; border:none; cursor:pointer;}
	#toggle_menu:hover{ background:#5F3BD7}
	#mobile_nav{ display:block; min-height:30px}
	.header-top ul{ display:none; float:none}
	.header-top ul li{ border-right:none; border-left:none}
	.header-top{ height:auto}
	.logobar{ height:auto}
	.veganlogo{ float:none}
	.slider2{ width:80%; margin:0 10%; height:216px;}
	.slider2 img{ width:100%}
	.section4 .footer ul li{ font-size:9px;}
	.section4 .middle .inner p{ font-size:15px; margin-bottom:30px}
	.section3 .middle .inner .span2 h2{ font-size:24px;}
	.section5 .inner h1{ font-size:36px; line-height:40px;}
	.signup-box div span{ display:block}
	.signup-box div{ width:95%; height:auto;}
	.signup-box div input{ height:36px; margin:6px 0 5px}
	#footer .inner ul li{ float:none; border:none; text-align:center}
	.section5 .inner h2 { font-size: 45px; line-height: 1.2em; }
	.section4 .footer .inner .sheep { display: none; }
	#form-submit {position: absolute; left: -435px;}
}

/*  iphone landscape */
@media only screen and (min-width: 480px) and (max-width: 599px){
	.royalSlider.wear.large { display: none; }
	.royalSlider.wear.small { display: block; }
	.inner{ margin:0 0 0 2%; width:96% }
	.logobar ul li{ min-height:30px;padding-top:13px; font-size:17px; margin:10px 0; float:left; width: 31%; margin-right: 2%; margin-top: 0; }
	.logobar ul li span{ margin-top:-6px; width:35px; height:33px; padding-top:2px; font-size:24px}
	.header-social{ display:none}
	.section1 { height: 300px; overflow: hidden; }
	.section1 .mask { margin-left: -10%; }
	.section1 .inner { width: 95%; height: 100%; }
	.section1 .inner .left{ width:100%; height:auto}
	.section1 .inner .left h1{ font-size:50px; margin-top:10px; line-height:1em;}
	.section1 .inner .left h1 span{ font-size:60px; display:block}
	.section1 .inner .left p{ margin-top:10px; font-size:18px; line-height:1.4em;}
	.section2 .header .inner h2, .section3 .header .inner h2, .section4 .header .inner h2 { font-size:38px; }
	.section2 .header .inner h2 span, .section3 .header .inner h2 span, .section4 .header .inner h2 span { height:45px; width:45px; font-size:37px;}
	.social-right{ display:none}
	.slider1-inner{ overflow:hidden; width: 289px; margin: 20px auto; }
	.section2 .footer{ padding-top:15px; height:60px; font-size:18px;}
	.section3 .header .inner h1{ font-size:31px;}
	.section3 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.section4 .header .inner h1{ font-size:31px;}
	.section4 .header .inner h1 span{ height:52px; width:53px; font-size:41px;}
	.section3 .middle .inner .span3{ margin:58px auto 0; float:none}
	.section3 .middle .inner .span3 span.check{ display:inline-block}
	.section3 .middle .inner .span3 span.label{ display:inline-block}
	.section3 .middle .inner .span3 span.search{ display:inline-block}
	.section3 .footer .inner div{ display:none}
	.section3 .middle .inner .span2{ width:auto}
	.section3{ height:auto}
	.section3 .middle{ height:auto}
	.section3 .middle .inner .span2 ul li{ float:none; height:auto; margin:0; width:auto; border:none; font-size:14px}
	.section3 .middle .inner .span2 ul{ width:auto; height:auto; padding:50px 0 20px}
	.section3 .middle .inner .span2{ height:auto}
	.section2 .header .inner p, .section3 .header .inner p, .section4 .header .inner p{ font-size:14px; line-height:1.4em;}
	.section5{ height:auto}
	.slider2-prev, .slider2-next{ display:none}
	.slider1-prev, .slider1-next{ display:none}
	.signup-box div button{ width:100px;}
	.signup-box div input{ width:200px;}
	.signup-box{ width:auto; height:auto; padding-bottom:10px;}
	.section4{ height:auto;}
	.section4 .footer{ padding-bottom:20px;}
	.slider1{ width:50%; margin:0 auto}
	#toggle_menu{ float:right; background:#47CDD7; border:none; cursor:pointer;}
	#toggle_menu:hover{ background:#5F3BD7}
	#mobile_nav{ display:block; min-height:30px}
	.header-top ul{ display:none; float:none}
	.header-top ul li{ border-right:none; border-left:none}
	.header-top{ height:auto}
	.logobar{ height:auto}
	.veganlogo{ float:none}
	.slider2{ width:80%; margin:0 10%; height:172px;}
	.slider2 img{ width:100%}
	.section4 .footer ul li{ font-size:9px;}
	.section4 .middle .inner p{ font-size:15px; margin-bottom:30px}
	.section3 .middle .inner .span2 h2{ font-size:24px;}
	.section3 .middle .inner .span2 p{ font-size:15px;}
	.section5 .inner h1{ font-size:36px; line-height:40px;}
	.signup-box div span{ display:block}
	.signup-box div{ width:95%; height:auto;}
	.signup-box div input{ height:36px; margin:6px 0 5px}
	#footer .inner ul li{ float:none; border:none; text-align:center}
	.section5 .inner ul{ height:auto; width:auto}
	.section5 .inner ul li{ float:none; margin:0 auto !important}
	.section3 .middle .inner .badge{ width:80%}
	.section4 .middle .inner .badge{ width:80%}
	.inner{ font-size:16px;}
	.section4 .middle{ padding-bottom:80px; height:auto}
	.section4 .footer .inner .sheep { display: none; }
	#form-submit {position: absolute; left: -435px;}
}

/*  iphone portrait */
@media only screen and (max-width: 479px){
	.royalSlider.wear.large { display: none; }
	.royalSlider.wear.small { display: block; }
	.inner{ margin:0 0 0 2%; width:96% }
	.logobar ul li{ min-height:30px; padding-top:13px; font-size:13px; margin:10px 0; float:left; width: 31%; margin-right: 2%; margin-top: 0; line-height: 1em; }
	.logobar ul li span{ margin-top:-6px; width:35px; height:33px; padding-top:2px; font-size:24px; line-height: 1.2em; }
	.header-social{ display:none}
	.section1 { padding-left: 0; overflow: hidden; height:300px; }
	.section1 .mask { margin-left: -5%; width: 107%; background: url(../images/mask.png) repeat-y -200px }
	.section1 img.how-to-wear { bottom: -50%; right: -80%; }
	.section1 .inner {width: 96%; height: 100%; }
	.section1 .inner .left{ width:100%; height:auto}
	.section1 .inner .left h1 { font-size:36px; margin-top:10px; line-height:1.2em;}
	.section1 .inner .left h1 span{ font-size:58px; display:block}
	.section1 .inner .left p{ margin-top:10px; font-size:16px; line-height:1.4em;}
	.section2 .header .inner h2, .section3 .header .inner h2, .section4 .header .inner h2 { font-size:38px; }
	.section2 .header .inner h2 span, .section3 .header .inner h2 span, .section4 .header .inner h2 span { height:45px; width:45px; font-size:37px;}
	.social-right{ display:none}
	.slider1-inner{ overflow:hidden; width: 289px; margin: 20px auto; }
	.section3 .header .inner h1{ font-size:21px;}
	.section3 .header .inner h1 span{ height:42px; width:43px; font-size:30px;}
	.section4 .header .inner h1{ font-size:21px;}
	.section4 .header .inner h1 span{ height:42px; width:43px; font-size:30px;}
	.section3 .middle .inner .span3{ margin:58px auto 0; float:none; width:100%; height:auto; padding-bottom:15px}
	.section3 .middle .inner .span3 span.check{ display:inline-block}
	.section3 .middle .inner .span3 span.label{ display:inline-block}
	.section3 .middle .inner .span3 span.search{ display:inline-block}
	.section3 .footer .inner div{ display:none}
	.section3 .middle .inner .span2{ width:auto}
	.section3{ height:auto}
	.section3 .middle{ height:auto}
	.section3 .middle .inner .span2 ul li{ float:none; height:auto; margin:0; width:auto; border:none; font-size:14px}
	.section3 .middle .inner .span2 ul{ width:auto; height:auto; padding:50px 10px 20px}
	.section3 .middle .inner .span2{ height:auto}
	.section2 .header .inner p, .section3 .header .inner p, .section4 .header .inner p{ font-size:14px; line-height:1.4em;}
	.section5{ height:auto}
	.slider2-prev, .slider2-next{ display:none}
	.slider1-prev, .slider1-next{ display:none}
	.signup-box div button{ width:100px;  top: -1px; position: relative; height: 36px; }
	.signup-box div input{ width:200px;}
	.signup-box{ width:auto; height:auto; padding-bottom:10px;}
	.section4{ height:auto;}
	.slider1{ width:50%; margin:0 auto}
	#toggle_menu{ float:right; background:#47CDD7; border:none; cursor:pointer;}
	#toggle_menu:hover{ background:#5F3BD7}
	#mobile_nav{ display:block; min-height:30px}
	.header-top ul{ display:none; float:none}
	.header-top ul li{ border-right:none; border-left:none}
	.header-top{ height:auto}
	.logobar{ height:auto}
	.veganlogo{ float:none}
	.slider2{ width:80%; margin:0 10%; height:172px;}
	.slider2 img{ width:100%}
	.section4 .footer ul li{ font-size:9px;}
	.section4 .middle .inner p{ font-size:15px; margin-bottom:30px}
	.section3 .middle .inner .span2 h2{ font-size:24px;}
	.section3 .middle .inner .span2 p{ font-size:12px;}
	.section5 .inner h1{ font-size:36px; line-height:40px;}
	.signup-box div span{ display:block}
	.signup-box div{ width:100%; height:auto;}
	.signup-box div input{ height:36px; margin:6px 0 5px}
	#footer .inner ul li{ float:none; border:none; text-align:center}
	.section5 .inner ul{ height:auto; width:auto}
	.section5 .inner ul li{ float:none; margin:0 auto !important}
	.section3 .middle .inner .badge{ width:100%}
	.section4 .middle .inner .badge{ width:100%}
	.inner{ font-size:14px;}
	.section4 .middle{ padding-bottom:10px; height:auto}
	.section3 .middle .inner .span2 .online-shopping{ width:100%; height:auto; padding-bottom:15px}
	/*.slider1-inner div span{ width:100%; background-size:100% 100%; height:auto}*/
	.slider1-inner div{ width:100%;}
	.slider1-inner div.first{ margin-left:0px;}
	.slider1-inner div.strip{ width:100%}
	.slider1-inner div p{ width:100%}
	.section5 .inner h2 { font-size: 38px; line-height: 1.2em;  }
	.section5 .inner h3 { font-size: 25px; line-height: 1.2em; }
	.section4 .footer .inner .sheep { display: none; }
	#form-submit {position: absolute; left: -435px;}
}