﻿/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* media queries - ideal break points: , 1024, 800, 600, 480 and 320 //////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* ================================================================================================================== */
/* Laptop =========================================================================================================== */
/* ================================================================================================================== */
@media only screen
and (max-width : 1280px) {

}/* /end */

 /* ================================================================================================================== */
 /* Tablet =========================================================================================================== */
 /* ================================================================================================================== */
@media only screen
and (max-width : 800px) {

/* tablet unique */
.tablet-hide                                    { display:none; }
.tablet-show                                    { display:block; }
.tablet100                                      { width:100%; }
.tablet50                                       { width:50%; }
.tablet33                                       { width:33.33%; }
.tablet-text-center                             { text-align:center; }

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* main ////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.wrapper                                        { overflow:hidden; } 
.content                                        { padding:0 8px; }

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* header //////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

header nav ul li ul                             { display:none; }
nav .menu                                       { display:block; padding:18px; float:left; }

/* header contact */
.header-contact                                 { display:none; }

/* nav contact */
.nav-contact                                    { display:block; float:right; }
.nav-contact p                                  { color:#fff; padding:4px; }
.nav-contact p a                                { padding-right:10px; }

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* footer //////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
footer .content                                 { font-size:1.6rem; }

footer ul > li                                  { display:block; width:100%; text-align:center; }
footer ul > li a                                { border-bottom:1px solid #ddd; padding: 10px 0; }
footer ul > li:last-child a                     { border-bottom:0; }
footer ul > li > ul                             { display:none; }

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* helpers /////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.on-screen-nav                                  { display:none; }

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* content /////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* content > product */
.product .product-text                          {   }

/* content > featured 3 col */
.featured3col .area25, .featured3col .area75    { width:100%; }

/* content > team */
.team-item                                      { width:33.33%; }

/* content > latest news item */
.latest-news-item .content-box                  { height:auto; }
.area25.featuted-img                            { width:50%; }

}/* /end */

/* =================================================================================================================== */
/* Mobile - large ==================================================================================================== */
/* =================================================================================================================== */
@media only screen
and (max-width : 600px) {

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* typography //////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

h1.large-h1                                     { font-size:2rem; line-height:2.8rem; padding:20px 0; }

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* main ////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.area20, .area25, .area33, .area40, .area50, .area60, .area66, .area75, .area80, .area90, .area100  { width:100%; }

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* content /////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* content > gallery */
.gallery .area25                                { width:50%; }

.main-gallery .area33                           { width:50%; }

/* content > product */
.product                                        { width:50%; }

/* content > featured 3 col */
.featured3col                                   { border-bottom:1px solid #ddd; }
.featured3col:nth-child(3)                      { border-bottom:0; }

/* content > team */
.team-item                                      { width:50%; }

/* content > featured  */
.featured .featuredItem                         { width:50%; }
.featured .featuredItem:nth-child(4)            { display:none; }

/* mobile unique*/
.mobile-center                                  { text-align:center; }
.mobile-show                                    { display:block; }
.mobile-hide                                    { display: none; }
.mobile-titanic                                 { float:none; }
.mobile100                                      { width:100%; }
.mobile50                                       { width:50%; }
.mobile33                                       { width:33% }
.mobile-text-center                             { text-align:center; }

/* accordion */
.accordion                                      { border: 1px solid #ddd;}
.accordion__title,
.accordion__content                             { float: none; margin: 0; }
.accordion__title:first-child                   { border: none; }
.accordion__title.active                        { }
.accordion__title.active, 
.accordion__title:hover                         { }
.accordion__title                               { border-right: 0; padding: 10px; }
.accordion__title:before                        { content: "+"; text-align: center; width: 20px; display: inline-block; }
.accordion__title.active:before                 { content: "-"; }
.overflow-scrolling                             { overflow-y: scroll;  height: 280px; padding: 10px 10px 0 10px; -webkit-overflow-scrolling: touch;    }
.accordion__content                             { position: relative; overflow: hidden; border:0; border-top:1px solid #ddd; padding: 0 10px; width: calc(100% - 12px); }
.no-js .accordion__content                      { padding: 10px; overflow: auto; display: block; }
.accordion__content:after                       { position: absolute; top: 100%; left: 0; width: 100%; height: 50px; border-radius: 10px 0 0 10px / 50% 0 0 50%; box-shadow: -5px 0 10px rgba(0, 0, 0, 0.5);  content: '';}

}/* /end */

/* =================================================================================================================== */
/* Mobile - landscape ================================================================================================ */
/* =================================================================================================================== */
@media only screen
and (max-width : 480px) {

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* content /////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* content > contact-us > praise */
.praise span                                    { width:100%; }
.praise span:nth-child(even)                    { padding-right:0; }

/* content > gallery */
.main-gallery .area33                           { width:100%; }

/* content > product */
.product                                        { width:100%; }
.product .product-text                          { max-height:none; min-height:0;  }

/* content > team */
.team-item                                      { width:100%; }

/* content > featured  */
.featured                                       { text-align:center; }
.featured .featuredItem                         { width:100%; display:none; }
.featured .featuredItem:nth-child(2)            { display:block; }

.featured .btn                                  { float:none; }

.area25.featuted-img                            { width:100%; }


}/* /end */


/* ================================================================================================================== */
/* Targeting specific device ======================================================================================== */
/* ================================================================================================================== */

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* STYLES GO HERE */
}
 
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* STYLES GO HERE */
}
 
/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* STYLES GO HERE */
}
 
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* STYLES GO HERE */
}
 
/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* STYLES GO HERE */
}
 
/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* STYLES GO HERE */
}
 
/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* STYLES GO HERE */
}
 
/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* STYLES GO HERE */
}
 
/* iPhone 5 (portrait &amp; landscape)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (-webkit-min-device-pixel-ratio : 2){
/* STYLES GO HERE */
}
 
/* iPhone 5 (landscape)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio : 2){
/* STYLES GO HERE */
}
 
/* iPhone 5 (portrait)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio : 2) {
/* STYLES GO HERE */
}

/* iPhone 6 (portrait &amp; landscape)----------- */
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (-webkit-min-device-pixel-ratio : 2){
/* STYLES GO HERE */
}
 
/* iPhone 6 (landscape)----------- */
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio : 2){
/* STYLES GO HERE */
}
 
/* iPhone 6 (portrait)----------- */
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio : 2){
/* STYLES GO HERE */
}

/* iPhone 6 plus (portrait &amp; landscape)----------- */
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (-webkit-min-device-pixel-ratio : 3){
/* STYLES GO HERE */
}
 
/* iPhone 6 plus (landscape)----------- */
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio : 3){
/* STYLES GO HERE */
}
 
/* iPhone 6 plus (portrait)----------- */
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio : 3){
/* STYLES GO HERE */
}