body{margin:0; padding:0; width:100%; font-size: 1.125em; /* 18px ÷ 16px = 1.125em */ font-family: 'Raleway', sans-serif;}
* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
*:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
html {height: 100%; box-sizing: border-box;}
@font-face {font-family: "Rokkitt-Regular"; src: url("fonts/Rokkitt-Regular.ttf");

  /*src: url("fonts/Rokkitt-Black.ttf") format("ttf");
  src: url("fonts/Rokkitt-Bold.ttf") format("ttf");
    src: url("fonts/Rokkitt-ExtraLight.ttf") format("ttf");
  src: url("fonts/Rokkitt-Light.ttf") format("ttf");
  src: url("fonts/Rokkitt-Regular.ttf") format("ttf");
  src: url("fonts/Rokkitt-SemiBold.ttf") format("ttf");
  src: url("fonts/Rokkitt-Thin.ttf") format("ttf");*/
}
@font-face {font-family: "Rokkitt-Medium"; src: url("fonts/Rokkitt-Medium.ttf");}
@font-face {font-family: "Rokkitt-ExtraBold"; src: url("fonts/Rokkitt-ExtraBold.ttf");}
@font-face {font-family: "ProximaN-Condensed"; src: url("fonts/FontsFree-Net-proxima_nova_reg-webfont.ttf");}
@font-face {font-family: "ProximaN-Bold"; src: url("fonts/FontsFree-Net-Proxima-Nova-Xbold.otf");}

.max1200{max-width: 1200px}
.centerDIV{margin:auto;}
.box600{max-width: 600px; margin:auto;}
.box700{max-width: 700px; margin:auto;}
.box640{max-width: 640px;}
.centerText{text-align: center}
.row{width: 100%;}
.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12{float:left; padding:10px;}
.col12 {width:100%;}.col11 {width:91.66666667%;}.col10 {width: 83.33333333%;}.col9 {width: 75%;}.col8 {width: 66.66666667%;}.col7 {Width: 58.33333333%;}.col6 {width: 50%;}.col5 {width: 41.66666667%;}.col4 {width: 33.33333333%;}.col3 {width: 25%;}.col2 {width: 16.66666667%;}.col1 {width: 8.33333333%;}
.pb0{padding-bottom: 0!important}
.p0{padding:0!important;}
.p20{padding:20px!important;}
.p10{padding:10px!important;}
.pb70{padding-bottom: 70px!important}
.pl100{padding-left: 100px !important}
.mgM50{margin-top:-50px!important;}
.floatLeft{float: left;}
p{font-family: "ProximaN-Condensed", serif;}

header{width: 100%; background-color: #141414; height: 100px; border-bottom: 6px solid #000; float: left; position: fixed; z-index: 9999}
header img{position: absolute; left: 50%; margin-left: -75px; margin-top:25px;}
header .header_buttons{float: right; margin-top: 27px; margin-right: 20px;}
header .header_buttons a:nth-child(1){border-right: 2px solid #DADADA}
header .header_buttons a:link, header .header_buttons a:visited, header .header_buttons a:active{background-color: #F4F4F4; color: #000; text-decoration: none; font-size: 15px; font-family: "ProximaN-Bold", serif; padding:13px 25px 13px 25px; display: inline-block;}
header .header_buttons a:hover{background-color:#CCC;}

.active::after{content: ""; border: medium solid transparent; border-top-color: #000; border-width: 6px; display: block; height: 0; width: 0; left: 50%; margin-left: -6px; top: 2.3em; position: relative;}

/* abrir ou fechar o menu */
input#control-nav {display:none;}
nav{position: absolute; margin-top:35px}

nav ul {padding:0px; margin:0px; list-style:none; width:auto;}
nav ul li{float:left;}
nav ul li:nth-child(1), nav ul li:nth-child(7), nav ul li:nth-child(8){display:none;}
nav ul li a:link, nav ul li a:active, nav ul li a:visited{font-family: 'Rokkitt-Regular', serif; color: #FFF; text-decoration: none; margin:0 15px 0 15px; font-size: 18px;}
nav ul li a:hover{text-decoration: underline;}

a.linkGreen:active, a.linkGreen:link, a.linkGreen:visited{color: #FFF; font-family: 'ProximaN-Bold', serif; font-size: 17px; background-color: #8ddc03; text-decoration: none; padding:15px 40px 15px 40px;}
a.linkGreen:hover{background-color: #7fc505;}

a.linkPink:active, a.linkPink:link, a.linkPink:visited{color: #FFF; font-family: 'ProximaN-Bold', serif; font-size: 17px; background-color: #ee2741; text-decoration: none; padding:15px 40px 15px 40px; font-weight: bold;}
a.linkPink:hover{background-color: #d31730;}

a.linkWhite:active, a.linkWhite:link, a.linkWhite:visited{color: #000; font-family: 'ProximaN-Bold', serif; font-size: 17px; background-color: #FFF; text-decoration: none; padding:15px 40px 15px 40px;}
a.linkWhite:hover{background-color: #CCC;}

#control-nav:checked ~ .control-nav-close {-webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); cursor:pointer;}
#control-nav:checked ~ nav {-webkit-transform: translate(0, 0);	-ms-transform: translate(0, 0);	transform: translate(0, 0);}
#control-nav:checked ~ nav{left:0!important;}
/* fim abrir ou fechar o menu */

.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}

.header-section{text-align: center;}
.header-section h3{font-family: 'ProximaN-Condensed', serif; font-weight: bold; font-size:17px; color: #8ddc03; width: 100%; float: left; margin:75px 0 0 0; padding-bottom: 8px;}
.header-section h2{font-family: 'Rokkitt-ExtraBold', serif; font-weight: bold; font-size:48px; color: #212121; text-transform: uppercase; margin:10px 0; line-height: 34px;}
.header-section h2::after {content: ' '; width: 50px; display: block; margin:22px auto 10px auto; height: 5px; background-color: #8ddc03;}

#clouds{width: 100%; float: left; padding-top: 15px; overflow: hidden; min-height: 600px; margin-top: 100px;}
#clouds .clouds{right: 70px; z-index: 0; transform: translatex(0px); animation: float 40s ease-in-out infinite; padding-bottom: 50px;}
@keyframes float {0% {transform: translatex(0px);} 50% {transform: translatex(400px);} 100% {transform: translatex(0px);}}
#clouds h2{font-size: 57px; font-family: 'Rokkitt-ExtraBold', serif; text-transform: uppercase; color: #212121; line-height: 53px; width: 100%; margin:0 0 30px 0; padding-top: 8vw;}
#clouds h3{font-size: 17px; margin:0 0 15px 0; font-family: 'ProximaN-Condensed', serif; color: #767575; text-align: left;}
#clouds .row{z-index: 2; margin-top: -530px}
#clouds .col4{position: relative; z-index: 3}
/*#clouds .col8 img{transform: translatey(0px); animation: floatProduct 6s ease-in-out infinite; width: 100%; max-width: 826px;}
@keyframes floatProduct {0% {transform: translatey(0px);} 50% {transform: translatey(-15px);} 100% {transform: translatey(0px);}}*/
#clouds .col8 img{ width: 100%; max-width: 826px; position: relative; z-index: 3}

/*#call{width: 100%; float: left; background-image: url(../img/call-bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; padding-bottom: 145px;}*/
#call{width: 100%; background-color:#f3f3f3; float: left; background-image:url(../img/about-dream-bg.jpg); background-repeat: no-repeat; margin-top: 50px; background-position: top right; padding-bottom: 150px;}
#call .threeBoxes{background-color: #FFF; border-top: 1px solid #c7c7c7; border-right: 1px solid #c7c7c7; border-left: 1px solid #c7c7c7; margin-left: 10px; margin-right: 10px; padding:20px; min-height: 329px;}
#call .threeBoxes h2{text-align: center; font-family: 'Rokkitt-ExtraBold', serif; font-size: 30px; color: #121212; margin:0; line-height: 24px; padding-bottom: 20px; text-transform: uppercase;}
#call .threeBoxes p{color:#767575; font-size:17px; margin: 0; line-height: 22px;}
#call .call-learn{background-color: #8ddc03; margin-left: 10px; margin-right: 10px; padding: 10px 10px 30px 10px; cursor:pointer; text-align: center; }
#call .call-learn:hover{background-color: #7fc505;}
#call .call-learn p{margin:0; font-size:15px; float: left; color: #FFF; line-height: 22px;}
#call .call-learn img{float:right; margin-top: 5px;}
#call .box600 p{font-size: 17px; color: #767575; line-height: 22px; margin-bottom: 40px; margin-top: 20px;}

#power{width: 100%; background-image:url(../img/power-bg.jpg); float: left; background-repeat: no-repeat; background-position: center center; background-size: cover;}
#power .col5 h2{color:#FFF; font-family: 'Rokkitt-ExtraBold', serif; font-size: 48px; text-transform: uppercase; line-height: 38px; margin:0; padding: 26px 0 5px 0;}
#power .col5 p{color: #FFF; font-size: 17px; margin:0 0 40px 0; width: 100%; float: left; width: 100%; line-height: 22px;}
#power .col5 a:active, #power .col5 a:link, #power .col5 a:visited{background-color:#fff; color: #000; font-family: 'ProximaN-Bold', serif; font-size: 17px; text-decoration: none; padding: 15px 30px 15px 30px;}
#power .col5 a:hover{background-color:#000; color: #FFF;}
#power .col7 img{margin-top: -85px; width: 100%;}

#products{width: 100%; float: left; margin-top: 80px; padding-bottom:70px;}
#products .col4 .products-whiteBox{border:1px solid #c7c7c7; text-align: center; margin-top: -80px; padding: 0 10px 25px 10px;}
#products .col4 img{margin:auto; display: block;}
#products .col4 h3{font-size: 17px; font-family: 'ProximaN-Condensed', serif; font-weight: bold; margin:0; padding:100px 0 10px 0;}
#products .col4 h2{font-size: 21px; font-family: 'Rokkitt-ExtraBold', serif; margin:0; padding:0 0 25px 0;}
#products .col4:nth-child(1) h3{color: #8ddc03}
#products .col4:nth-child(2) h3{color: #ee2741}
#products .col4:nth-child(3) h3{color: #ef9c20}
#products .col4:nth-child(1) a:link, #products .col4:nth-child(1) a:active, #products .col4:nth-child(1) a:visited{background-color:#8ddc03; color: #FFF; padding:15px 30px 15px 30px; font-family: 'ProximaN-Bold', serif; font-size: 15px; text-decoration: none; display: inline-block; margin:0 5px 0 5px;}
#products .col4:nth-child(1) a:hover{background-color:#7BC402;}
#products .col4:nth-child(2) a:link, #products .col4:nth-child(2) a:active, #products .col4:nth-child(2) a:visited{background-color:#ee2741; color: #FFF; padding:15px 30px 15px 30px; font-family: 'ProximaN-Bold', serif; font-size: 15px; text-decoration: none; display: inline-block; margin:0 5px 0 5px;}
#products .col4:nth-child(2) a:hover{background-color:#E0122C;}
#products .col4:nth-child(3) a:link, #products .col4:nth-child(3) a:active, #products .col4:nth-child(3) a:visited{background-color:#ef9c20; color: #FFF; padding:15px 30px 15px 30px; font-family: 'ProximaN-Bold', serif; font-size: 15px; text-decoration: none; display: inline-block; margin:0 5px 0 5px;}
#products .col4:nth-child(3) a:hover{background-color:#E08D10;}

#testimonials{width: 100%; float: left; background-repeat: no-repeat; background-position: center center; background-size: cover; text-align: center; margin-top:0px; padding-bottom: 30px;}
#testimonials .testimonials-slider{max-width: 600px; margin:auto; text-align: center; padding-bottom: 25px;}
#testimonials .testimonials-slider p{font-size: 17px; color: #212121; line-height: 22px; margin-bottom: 40px; text-align: center; margin-top: 10px; min-height: 66px}
#testimonials .testimonials-slider h4{font-family: 'Rokkitt-Medium', serif; font-size: 21px; color: #212121;}
#testimonials .testimonials-slider h4:before{ content: ""; border-top: 1px solid #000; width: 20px; display: inline-block; padding-bottom: 5px; margin-right: 6px}
.testimonials-slider .slick-prev{background-image:url(../img/testimonials-arrows.png); background-repeat: no-repeat; background-color:transparent; width: 24px;}
.testimonials-slider .slick-next{background-image:url(../img/testimonials-arrows.png); background-repeat: no-repeat; background-color:transparent; width: 24px; background-position:-24px;}

#pack{width: 100%; float: left; margin-top: 100px;}
#pack .pack-image{float: left;}
#pack .pack-image img{margin-top: -79px}
#pack .pack-red-bg{background-image:url(../img/pack-bg.jpg); min-height: 242px; margin-left: 300px; background-repeat: no-repeat; background-position: center center; background-size: cover; padding:40px 40px 40px 90px;}
#pack .pack-red-bg h2{margin:0; text-transform: uppercase; color: #FFF; font-family: 'Rokkitt-ExtraBold', serif; font-size: 48px; line-height: 36px; padding-bottom: 10px;}
#pack .pack-red-bg p{color: #FFF; font-size: 17px; margin:0; line-height: 22px;}
#pack .pack-red-bg .col3{padding: 70px 0 0 0; text-align: center;}

#news{width: 100%; float: left; background-color: #eee; padding:70px 0 70px 0;}
#news .col12{background-color: #FFF;}
#news .cover{width: 100%}
#news h2{text-align: center; font-family: 'Rokkitt-ExtraBold', serif; color: #212121; font-size: 48px; margin:0; padding-bottom: 25px;}
#news .news-read{background-color: #8ddc03; padding: 10px 10px 30px 10px; cursor: pointer; text-align: center;}
#news .news-read:hover{background-color: #7fc505;}
#news .news-read p{margin:0; font-size:15px; float: left; color: #FFF; line-height: 22px; font-family: 'ProximaN-Bold', serif!important;}
#news .news-read img{float:right; margin-top: 5px;}
#news h3{margin:0; color: #767575; font-size: 16px; font-family: "ProximaN-Condensed", serif; text-align: left; padding:0;}
#news span{margin:0; padding:10px 0 0px 0; font-family: 'Rokkitt-ExtraBold', serif; color:#121212; font-size: 30px; text-transform: uppercase; border-bottom: 2px solid #000;}
#news span a:link, #news span a:visited, #news span a:active{color:#000; text-decoration: none;}
#news span a:hover{color:#333;}

#all{width: 100%; float: left; background-image:url(../img/clouds.png); background-repeat: no-repeat; background-position: top center; padding-top:80px; padding-bottom: 80px; margin-top: 100px;}
#all h3{font-size: 21px; font-family: 'Rokkitt-Medium', serif; margin:18px 0 0 0; color: #212121; font-weight: normal; line-height: 25px;}
#all p{font-size: 17px; color: #767575; line-height: 22px;}

#about-dream{width: 100%; background-color:#f3f3f3; float: left; background-image:url(../img/about-dream-bg.jpg); background-repeat: no-repeat; margin-top: 180px; background-position: top right; padding-bottom: 80px;}
#about-dream .about-dream-boxes{margin-top:-160px; width: 100%}
#about-dream .col4 .products-whiteBox{border:1px solid #c7c7c7; text-align: center; margin-top: -50px; padding:25px 25px 0 25px; min-height: 355px; float: left; background-color: #FFF;}
#about-dream .col4 img{margin:auto; display: block;}
#about-dream .col4 h3{font-size: 30px; font-family: 'Rokkitt-ExtraBold', serif; margin:55px 0 0 0; padding:0 0 6px 0; text-transform: uppercase; line-height: 24px;}
#about-dream .col4 p{line-height: 22px; color: #767575; font-size: 17px; text-align: left; font-weight: normal;}
#about-dream .header-section{text-align: left;}
#about-dream .header-section h3{color: #ee2741;}
#about-dream .header-section h2::after {background-color: #ee2741; margin:20px 0 10px 0;}
#about-dream p{line-height: 22px; font-size:17px; color: #212121; padding-bottom: 30px; margin-top: 18px;}

#productsPage{width: 100%; float: left; background-image:url(../img/bigclouds.jpg); background-repeat: no-repeat; background-position: center center; padding-top:80px; margin-top: 100px}
#productsPage img{width: 100%; max-width: 502px; margin:auto; display: block;}
#productsPage h3{font-family: "ProximaN-Condensed", serif; font-size: 17px; margin:0; padding:150px 0 15px 0; font-weight: bold; width: 100%;}
#productsPage h2{font-family: 'Rokkitt-ExtraBold', serif; font-size: 48px; margin:0; padding:0 0 30px 0; width: 100%; color: #212121; text-transform: uppercase; line-height: 35px;}
#productsPage .product01 a:link, #productsPage .product01 a:visited, #productsPage .product01 a:active{background-color:#8ddc03; color: #FFF; padding:15px 30px 15px 30px; font-family: 'ProximaN-Bold', serif; font-size: 15px; text-decoration: none; display: inline-block; margin:0 5px 0 5px;}
#productsPage .product01 a:hover{background-color:#7BC402;}
#productsPage .product02 a:link, #productsPage .product02 a:visited, #productsPage .product02 a:active{background-color:#ef9c20; color: #FFF; padding:15px 30px 15px 30px; font-family: 'ProximaN-Bold', serif; font-size: 15px; text-decoration: none; display: inline-block; margin:0 5px 0 5px;}
#productsPage .product02 a:hover{background-color:#E08D10;}
#productsPage .product03 a:link, #productsPage .product03 a:visited, #productsPage .product03 a:active{background-color:#ee2741; color: #FFF; padding:15px 30px 15px 30px; font-family: 'ProximaN-Bold', serif; font-size: 15px; text-decoration: none; display: inline-block; margin:0 5px 0 5px;}
#productsPage .product03 a:hover{background-color:#E0122C;}
#productsPage .product01, #productsPage .product02, #productsPage .product03{padding:50px 0 50px 0;}
#productsPage .productsPage-box{max-width: 400px;}
.product-reading h3{padding:95px 0 15px 0!important;}
.product01 h3{color: #8ddc03!important}
.product02 h3{color: #ef9c20!important}
.product03 h3{color: #ee2741!important}
.product01 h2::after{background-color: #8ddc03!important}
.product02 h2::after{background-color: #ef9c20!important}
.product03 h2::after{background-color: #ee2741!important}

.nutrition{max-width: 306px!important; margin:0 0 30px 0 !important;}

#newsPage{width: 100%; padding-top: 80px; float: left; padding-bottom:70px;}
#newsPage h2{font-family: 'Rokkitt-ExtraBold', serif; font-size: 48px; margin:0; padding:0 0 30px 0; width: 100%; color: #212121; text-transform: uppercase; line-height: 35px;}
#newsPage .newsPage-box{position: relative; margin-bottom: 35px;}
#newsPage .newsPage-box h3{position: absolute; color: #FFF; font-size: 17px; margin:0 0 8.1rem; width: 100%; bottom:0; left: 0; z-index: 3; padding-left: 30px}
#newsPage .newsPage-box .newsPage-cover{width: 100%; overflow: hidden; position: relative; border: 0; margin: 0; padding: 0;}
#newsPage .newsPage-mask{height: 100%; width: 100%; top: 0; left: 0; position: absolute; background: linear-gradient(to bottom, rgba(29, 32, 35, 0) 0%, #1d2023 100%); -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; opacity: 1; z-index: 1}
#newsPage .newsPage-box:hover > .newsPage-mask{opacity: 0; transition: all 0.3s ease;}
#newsPage span{margin:0 0 3.1rem; padding:10px 30px 0px 30px; font-family: 'Rokkitt-ExtraBold', serif; color:#121212;
font-size: 30px; text-transform: uppercase; position: absolute; bottom:0; left: 0; z-index: 3}
#newsPage span a:link, #newsPage span a:visited, #newsPage span a:active{color:#FFF; text-decoration: underline;}
#newsPage span a:hover{color:#333;}
#newsPage .news-read{background-color: #8ddc03; padding:10px; cursor: pointer; text-align: center; position: absolute; z-index: 3; bottom:0; right: 0}
#newsPage .news-read:hover{background-color: #7fc505;}
#newsPage .news-read p{margin:0; font-size:15px; float: left; color: #FFF; line-height: 22px; font-family: "ProximaN-Bold", serif!important;}
#newsPage .news-read img{float:right; margin-top: 6px; padding-left: 20px}
#newsPage .newsPage-boxRight{width: 100%; border-bottom: 1px solid #dddcdc; padding-bottom: 35px; margin-bottom: 35px;}
#newsPage .newsPage-boxRight h4{margin:0 0 15px 0; font-family: 'Rokkitt-ExtraBold', serif; font-size: 30px; color:#121212; text-transform: uppercase;}
#newsPage .newsPage-boxRight input{width: 100%; background-color:#f4f4f4; color: #767575; font-size: 15px; font-family: "ProximaN-Condensed", serif; font-weight: bold; border:0; padding:13px; margin-bottom: 10px;}
#newsPage .newsPage-boxRight button{background-color: #121212; font-family: "ProximaN-Condensed", serif; color: #fff; font-size: 15px; padding:13px; border:0; cursor: pointer;}
#newsPage .newsPage-boxRight button:hover{background-color: #CCC; color: #121212}
#newsPage .newsPage-boxRight button img{margin-left: 10px;}
#newsPage .newsPage-boxRight .tags a:link, #newsPage .newsPage-boxRight .tags a:active, #newsPage .newsPage-boxRight .tags a:visited{font-family: "ProximaN-Condensed", serif; font-size: 15px; font-weight: bold; text-decoration: none; color: #FFF; padding:5px 6px 5px 6px; margin:0 5px 0 5px;}
#newsPage .newsPage-boxRight .tags a:hover{background-color: #DDD};

a.tag1:link, a.tag1:active, a.tag1:visited{background-color: #ee2741;}
a.tag2:link, a.tag2:active, a.tag2:visited{background-color: #ee2741;}
a.tag3:link, a.tag3:active, a.tag3:visited{background-color: #121212;}
a.tag4:link, a.tag4:active, a.tag4:visited{background-color: #ffa014;}
a.tag5:link, a.tag5:active, a.tag5:visited{background-color: #8ddc03;}

.pagination {display: inline-block; padding: 0; text-align: center; margin: 0;}
.pagination li{display: inline; font-family: 'Rokkitt-Medium', serif; }
.pagination > li > a {color: #767575; padding: 0px 10px; float: left; text-decoration: none; font-size: 21px;}
.pagination > li > a:hover {color:#212121;}
.pagination > .activePg > a, .pagination > .activePg > a:hover{color:#212121;}

 /* background-image:url(../img/contact-bg.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover; */
#contact{width: 100%; padding-top: 80px; float: left; padding-bottom: 80px; background-image:url(../img/clouds.png); background-repeat: no-repeat; background-position: top center; margin-top: 100px}
#contact .header-section h3{margin:0!important;}
#contact p{font-size: 17px; color: #212121; line-height: 22px; margin-bottom: 40px; margin-top: 20px;}
#contact form input, #contact form textarea{width: 100%; background-color:#f4f4f4; color: #767575; font-size: 15px; font-family: "ProximaN-Condensed", serif; border:0; padding:13px;}
#contact form input:hover, #contact form textarea:hover{background-color:#D3D3D3;}
#contact form button{color: #FFF; background-color:#8ddc03; padding:22px 60px 22px 60px; border:0; cursor: pointer; font-family: "ProximaN-Bold", serif;
 font-size: 15px;}
#contact form button:hover{background-color:#7fc505;}

#contactThreeBoxes{width: 100%; float: left; padding:50px 0 50px 0;}
#contactThreeBoxes .contact03{border:1px solid #c7c7c7; text-align: center; min-height: 176px; padding-top: 25px;}
#contactThreeBoxes .contact03 h3{margin:0;font-family: 'Rokkitt-ExtraBold', serif; color: #121212; font-size: 30px; text-transform: uppercase;}
#contactThreeBoxes .contact03 p{line-height: 22px; font-size:17px; color: #767575; padding-bottom: 30px; margin-top: 18px; margin-bottom:0;}
#contactThreeBoxes .contact03 a{color: #767575; text-decoration: none;}
#contactThreeBoxes .footer-social{width: 105px; margin:38px auto;}
#contactThreeBoxes .footer-social a:link, #contactThreeBoxes .footer-social a:active, #contactThreeBoxes .footer-social a:visited{color:#FFF;}
#contactThreeBoxes .footer-social a:hover{color: #000;}

footer{background-color: #343434; width: 100%; float: left; padding: 50px 0 0 0;}
footer .footer-logo{float:left;}
footer ul.footer-menu{list-style:none; text-align: center; margin:0; padding:13px 0 0 0;}
footer ul.footer-menu li{display: inline; margin:0 10px 0 10px;}
footer ul.footer-menu li a:link, footer ul.footer-menu li a:active, footer ul.footer-menu li a:visited{color: #FFF; text-decoration: none; font-family: "ProximaN-Condensed", serif; font-size: 15px;}
footer ul.footer-menu li a:hover{text-decoration: underline;}
footer .footer-social{float: right; margin-top: -20px;}
footer hr{width: 100%; float: left; margin:40px 0 40px 0; border-bottom:1px solid #767575;}
footer h2{color: #f3f3f3; font-family: 'Rokkitt-Regular', serif; margin: 0; font-size: 20px; width: 100%; padding:10px 0 10px 0;}
footer span, footer span a:link, footer span a:visited, footer span a:active{color: #767575; font-family: "ProximaN-Condensed", serif; font-size: 15px; text-decoration: none; line-height: 20px;}
footer .copyright{background-color: #212121; text-align: center; font-family: "ProximaN-Condensed", serif; font-size: 13px; color: #767575; padding:15px 0 15px 0; float: left; width: 100%}
footer .footer-2nd{float: left;}
footer form input[type=text]{background-color: #2a2a2a; font-size: 15px; border:0; padding:15px; color: #767575; font-family: "ProximaN-Condensed", serif;}
footer form input[type=text]:hover{background-color: #121212;}
footer form button{background-color: #121212; color: #FFF; border:0; padding:17px; cursor: pointer; font-weight: bold; -webkit-appearance: none; height: 46px;}
footer form button:hover{background-color: #CCC; color: #121212;}
footer form button img{margin-left: 10px}
footer .back-top{float: right; margin-top: 35px;}

.icon {position:relative; text-align:center; width:0px; height:0px; padding:15px; border-top-right-radius: 15px; border-top-left-radius: 15px; border-bottom-right-radius: 15px; border-bottom-left-radius: 15px; -moz-border-radius:15px 15px 15px 15px; -webkit-border-radius:15px 15px 15px 15px; -khtml-border-radius:15px 15px 15px 15px;}
.icon i{font-size:15px; position:absolute; left:9px; top:10px;}
.icon.social{float:left; margin:0 5px 0 0; cursor:pointer; background:#000 ; color:#FFF; transition: 0.5s; -moz-transition: 0.5s; -webkit-transition: 0.5s; -o-transition: 0.5s;}
.icon.social:hover {background:#FFF; color:#000; transition: 0.5s; -moz-transition: 0.5s; -webkit-transition: 0.5s; -o-transition: 0.5s;}
.icon.social.tw i{left:9px; top: 8px}
.icon.social.fb i{left:11px; top:8px;}
.icon.social.in i{left:9px; top: 7px;}

.input-group{position: relative; display: table; border-collapse: separate;}
.input-group .form-control{display:table-cell;}
.input-group .form-control {position: relative; z-index: 2; float: left; width: 100%; margin-bottom: 0;}
.input-group-btn{position: relative; font-size: 0; white-space: nowrap;}
.input-group-btn{width: 1%; white-space: nowrap; vertical-align: middle;}
.input-group-btn{display:table-cell;}

@media screen and (max-width: 885px) and (min-width: 421px){
  #newsPage span{font-size:20px;}
  #newsPage .newsPage-box h3{margin:0 0 6.1rem; font-size: 15px;}
}

@media screen and (max-width: 420px) and (min-width: 338px){
  #newsPage span{font-size:20px;}
  #newsPage .newsPage-box h3{margin:0 0 7.1rem; font-size: 15px;}
}
@media screen and (max-width: 337px) and (min-width: 0px){
  #newsPage span{font-size:15px;}
  #newsPage .newsPage-box h3{margin:0 0 7.5rem; font-size: 15px;}
}


@media screen and (max-width: 1169px) and (min-width: 769px){
  a.linkWhite:active, a.linkWhite:link, a.linkWhite:visited, a.linkWhite:hover{font-size: 12px;}
  #pack .pack-red-bg h2{font-size: 21px; line-height: 20px}
  #pack .pack-red-bg p{font-size: 14px;}
}

@media screen and (max-width: 387px) and (min-width: 0){
  #products .col4 a{width: 100%; margin:0 0 10px 0!important;}
}
@media screen and (max-width: 768px) and (min-width: 0){
	.back-top{display: none!important}
  .pl100{padding-left:10px!important;}
  #about-dream .col4 h3{font-size: 23px}
  #all{padding-bottom: 0}
  #productsPage h3, .product-reading h3{padding-top:20px;}
  #productsPage .productsPage-box{max-width: 100%; text-align: center;}
  #productsPage .product02 {display:flex; flex-flow: column;}
  #productsPage .product02 .product01Pic{order:2;}
  #productsPage .product02 .product02Pic{order:1;}
  #productsPage .product01, #productsPage .product02, #productsPage .product03{padding:0px 0 50px 0;}

  #about-dream, #call{background-position: bottom center;}
  footer .back-top{float: none; margin: auto; width: 65px;}
  footer .footer-2nd{text-align: center}
  footer .footer-logo{float:none; margin:auto; display: block;}
  footer .footer-social{width: 105px; float:none; margin:25px auto auto auto;}
  #pack .pack-image img{max-width: 353px; margin:auto; display: block; width: 100%}
  #pack .pack-image, #pack .pack-red-bg{width: 100%; float: left;}
  #pack .pack-red-bg{margin:0; padding:25px 25px 40px 25px;}
  #pack .pack-red-bg .col3{padding:22px 0 0 0;}
  .col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12{width:100%}
  #call .threeBoxes p{text-align: center;}
  #power .col7 img{margin-top:0;}
}

@media screen and (max-width: 1024px) and (min-width: 769px){
  #clouds{min-height: 470px}
}

@media screen and (max-width: 1130px) and (min-width: 877px){
  #power .col5 h2{font-size: 27px; line-height: 23px; padding:17px 0 5px 0;}
  #power .col5 p{font-size: 13px; margin:0 0 22px 0;}
}

@media screen and (max-width: 876px) and (min-width: 769px){
  #power .col5 a:active, #power .col5 a:link, #power .col5 a:visited{font-size: 15px; padding: 7px 20px 7px 20px;}
  #power .col5 h2{font-size: 18px; line-height: 23px; padding:0px 0 5px 0;}
  #power .col5 p{font-size: 13px; margin:0 0 10px 0;}
}

@media screen and (max-width: 930px) and (min-width: 0){
	/*#all, #clouds, #productsPage, #contact{margin-top:0px}
	header{position:static;}*/
  #clouds h2{text-align: center; font-size: 60px}
  nav ul li:nth-child(1), nav ul li:nth-child(7), nav ul li:nth-child(8){display:block;}
  nav ul li:nth-child(7) a:link, nav ul li:nth-child(7) a:visited, nav ul li:nth-child(7) a:active, nav ul li:nth-child(8) a:link, nav ul li:nth-child(8) a:visited, nav ul li:nth-child(8) a:active{background-color: #F4F4F4; color: #000; text-decoration: none; font-size: 15px; font-family: "ProximaN-Condensed", serif; padding:13px 25px 13px 25px; width: 100%;}
  nav ul li:nth-child(7) a:hover, nav ul li:nth-child(8) a:hover{background-color:#CCC;} 

  .active::after{border:0;}
  header li a:hover{background-color: transparent}
  nav ul li:nth-child(1){padding-bottom: 56px; border-bottom: 2px solid #000;}
  nav ul li .mobile-menu{position: absolute; left: 50%; margin-left: -40px; margin-top: 10px;}
  nav ul li .mobile-close{margin-top: 13px; position: static; cursor: pointer;}

  nav ul li a:link, nav ul li a:active, nav ul li a:visited{width: 100%; float: left;; text-align: center; margin:0;}
  .header_buttons{display:none;}
  header li a{padding:15px 10px; color:#FFF;}
  nav ul li{width:100%; margin-bottom: 10px;}
  header .control-nav {position: absolute; right: 20px; top: 40px; display: block; width: 30px; padding: 5px 0; border: solid #FFF; border-width: 3px 0; z-index: 9001; cursor: pointer;}  
  header .control-nav:before {content: ""; display: block; height: 3px; background: #FFF;}  
  header .control-nav-close {position: absolute; top: 0; bottom: 0; left: 78px; display: block; z-index: 9002; background: rgba(0,0,0,0.4); -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0);}
  header nav{position: fixed; top: 0; right:0; bottom: 0; width: 100%; background: #141414; overflow-x: auto; z-index: 9003; -webkit-transition: all 500ms ease; transition: all 500ms ease; -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0); margin-top:0px; padding: 0 10px 0 10px;}
}