@charset "utf-8";
/* CSS Document */

/*template*/
*{margin:0; padding:0; outline:none;}
img,fieldset{border:0px; display:block;}
br.clear, div.clear{clear:both; font-size:0px;}
ul, ol{list-style:none;}
html{width:100%; height:100%; font-size:62.5%;}
body{width:100%; height:100%; background:url(../images/background.jpg) repeat #ffffff; overflow-x:hidden; font-family:'Nunito', sans-serif; overflow-y:scroll; font-size:18px; font-size:1.8rem; line-height:1.628571; color:#131217; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}

h1, h2, h3, h4, h5, h6{width:100%; height:auto; font-weight:600; line-height:1.2; text-transform:lowercase; font-family:'Amatic SC', cursive; text-align:center; font-weight:normal;}
h1{font-size:48px; font-size:4.8rem; margin:0px 0px 35px 0px;}
h1.big{font-size:72px; font-size:7.2rem;}
h2{font-size:36px; font-size:3.6rem; font-family:'Tinos', cursive; font-weight:800;}
h3{font-size:18px; font-size:1.8rem; font-family:'Nunito', sans-serif; margin:0px 0px 35px 0px;}
h1.nomargin,
h2.nomargin,
h3.nomargin,
h4.nomargin,
h5.nomargin,
h6.nomargin{margin:0px;}
h1.left,
h2.left,
h3.left,
h4.left,
h5.left,
h6.left{text-align:left;}
h1.grey,
h2.grey,
h3.grey,
h4.grey,
h5.grey,
h6.grey{color:#606060;}
h1.bronze,
h2.bronze,
h3.bronze,
h4.bronze,
h5.bronze,
h6.bronze{color:#bd8951;}

p{margin:0px 0px 35px 0px;}
a, a *{color:#ffffff; text-decoration:none;}
a.more{font-family:'Nunito', sans-serif; color:#131217; text-decoration:none !important; font-size:20px; font-size:2.0rem; font-weight:normal;}
a.more i{text-decoration:none; margin-left:10px; color:#131217;}
a.more.center{margin:0px auto;}
small{font-size:12px; font-size:1.2rem;}
article ul,
article ol{list-style:disc outside; margin:0px 0px 30px 20px;}
article p:last-of-type{margin:0px;}
article a,
article * a{color:#bd8951;}

button{-webkit-appearance:none;}
.button{border:0px; font-family:'Nunito', sans-serif; color:#ffffff; background-color:#bd8951; padding:8px 16px; margin:8px auto; text-align:center; font-size:1.8rem; border-radius:10px; text-decoration:none; cursor:pointer;}
.button:hover{background:#51bd89;}

table{}
table td{vertical-align:top; padding:3px 0px;}

header, nav, article, aside, section, footer{display:block !important; overflow:hidden;}
header, section, footer{width:100%; height:auto; position:relative;}

.left{float:left !important;}
.right{float:right !important;}

.video-container{position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed {position:absolute; top:0; left:0; width:100%; height:100%;}

/*steps*/
.progress{width:100%; height:88px;}
.steps{height:40px; position:relative;}
.steps .bg{width:100%; height:5px; display:block; position:absolute; top:20px; background:#222222;}
.steps .steps-inner{position:relative; z-index:9;}
.steps .steps-inner .step{width:32%; height:40px; float:left;}
.steps .steps-inner .step.first{width:18%; margin:0px !important;}
.steps .steps-inner .step.last{width:18%; margin:0px !important;}
.steps .steps-inner .step.first .step-inner{float:left;}
.steps .steps-inner .step.last .step-inner{float:right;}
.steps .steps-inner .step .step-inner{width:40px; height:40px; display:block; margin:auto; overflow:hidden; color:#222222; border-radius:40px; font-weight:bold; border:3px solid #222222; background:#fff; text-align:center; line-height:36px; font-size:2.0rem;}
.steps .steps-inner .step .step-inner.on{color:#ffffff; border-color:#bd8951; background:#bd8951;}
.steps .steps-inner .step .step-inner.active{color:#bd8951; border:3px solid #bd8951; background:#ffffff;}
.steps.three .steps-inner .step{width:50%;}
.steps.three .steps-inner .step.first{width:25%;}
.steps.three .steps-inner .step.last{width:25%;}
.steps.five .steps-inner .step{width:24%;}
.steps.five .steps-inner .step.first{width:14%;}
.steps.five .steps-inner .step.last{width:14%;}

/*forms*/
form.form-grid{display:grid; grid-template-columns:160px auto; gap:16px; width:80%; margin:0px auto;}
form.form-grid div *{box-sizing:border-box;}
form.form-grid div a{color:#bd8951;}
form.form-grid .wide{grid-column-end:span 2;}
form.form-grid h2{margin-top:35px; margin-bottom:0px; font-size:2.4rem;}
form.form-grid h3{margin-top:35px; margin-bottom:0px; font-size:2.0rem;}
form.form-grid div.padding{padding:8px 0px;}
form.form-grid div.row{border-bottom:1px dotted #eae9e9;}
form.form-grid div.noborder{border-bottom:none !important;}
form.form-grid div.label{color:#2a2620;}
form.form-grid.white div.label{color:#ffffff;}
form.form-grid div.row label.red{color:#e2001a;}
form.form-grid div.wide .summary{display:grid; grid-template-columns:auto 140px; gap:16px;}
form.form-grid div.wide .summary div{font-size:1.8rem;}
/*form.form-grid div span{display:block; height:32px; line-height:32px; color:#a3a3a3; font-size:1.2rem;}*/
form.form-grid div input[type="text"],
form.form-grid div input[type="number"],
form.form-grid div input[type="date"],
form.form-grid div input[type="time"],
form.form-grid div input[type="datetime-local"]{width:100%; height:24px; line-height:24px; padding:16px; font-size:1.8rem; font-family:'Nunito', sans-serif; border-radius:8px; border:1px solid #eae9e9; color:#2a2620; background:#ffffff;}
form.form-grid div select{width:100%; height:24px; line-height:24px; font-size:1.8rem; padding:16px; border-radius:8px; color:#2a2620; background:#ffffff; border:1px solid #eae9e9; font-family:'Nunito', sans-serif; color:#555555;}
form.form-grid div select{height:unset; line-height:unset; padding:8px 16px;}
form.form-grid div select option{color:#555555;}
form.form-grid div input[type="text"].red,
form.form-grid div input[type="number"].red,
form.form-grid div input[type="date"].red,
form.form-grid div input[type="time"].red,
form.form-grid div select.red,
form.form-grid div input[type="datetime-local"].red{border:1px solid #e2001a;}
form.form-grid div input[type="text"]:focus,
form.form-grid div input[type="number"]:focus,
form.form-grid div input[type="date"]:focus,
form.form-grid div input[type="time"]:focus,
form.form-grid div input[type="datetime-local"]:focus{border:1px solid #2a2620;}
form.form-grid div textarea{width:100%; height:300px; line-height:24px; padding:16px; border-radius:8px; font-size:1.8rem; font-family:'Nunito', sans-serif; background:#ffffff; color:#2a2620; border:1px solid #eae9e9} 
form.form-grid div textarea:focus{border:1px solid #303030;}
form.form-grid div.submit{display:grid; grid-template-columns:1fr 1fr;}
form.form-grid div.submit .button-left input[type=button],
form.form-grid div.submit .button-left input[type=submit]{border:0px; font-family:'Nunito', sans-serif; color:#555555; background-color:#eae9e9; padding:8px 16px; text-align:center; font-size:1.8rem; border-radius:10px; text-decoration:none; float:left; cursor:pointer;}
form.form-grid div.submit .button-left input[type=button]:hover,
form.form-grid div.submit .button-left input[type=submit]:hover{background:#51bd89; color:#ffffff}
form.form-grid div.submit .button-right input[type=button],
form.form-grid div.submit .button-right input[type=submit]{border:0px; font-family:'Nunito', sans-serif; color:#ffffff; background-color:#bd8951; padding:8px 16px; text-align:center; font-size:1.8rem; border-radius:10px; text-decoration:none; float:right; cursor:pointer;}
form.form-grid div.submit .button-right input[type=button]:hover,
form.form-grid div.submit .button-right input[type=submit]:hover{background-color:#51bd89;}
form.form-grid div.submit .button-right input[type=submit].grey{color:#f1f1f1; background-color:#444444;}
form.form-grid div.calendar{padding:0px 0px 70px 0px;}
form.form-grid div.calendar .date{width:100%; position:relative; display:inline-block;}
form.form-grid div.calendar .date .ui-datepicker{width:auto !important; display:grid !important; grid-template-columns:1fr 1fr; grid-gap:35px;}
form.form-grid div.calendar .date .ui-datepicker-group{background:rgba(255,255,255,0.4);}
form.form-grid div.calendar .date .ui-datepicker-row-break{display:none;}
form.form-grid div.calendar .date .ui-datepicker-header{background:#303031; color:#ffffff; height:50px; position:relative;}
form.form-grid div.calendar .date .ui-datepicker-title{text-align:center; line-height:50px; font-size:1.6rem; color:#fff;}
form.form-grid div.calendar .date .ui-datepicker-prev{cursor:pointer; float:left; display:block; border-bottom:10px solid transparent; border-top:10px solid transparent; border-left:10px solid transparent; border-right:10px solid #ffffff; text-indent:-9999px; height:0; width:0; margin-top:15px; margin-left:10px;}
form.form-grid div.calendar .date .ui-datepicker-next{cursor:pointer; float:right; display:block; border-bottom:10px solid transparent; border-top:10px solid transparent; border-left:10px solid #ffffff; border-right:10px solid transparent; text-indent:-9999px; height:0; width:0; margin-top:15px; margin-right:10px;}
form.form-grid div.calendar .date .ui-datepicker-prev:hover{border-right:10px solid #bd8951;}
form.form-grid div.calendar .date .ui-datepicker-next:hover{border-left:10px solid #bd8951;}
form.form-grid div.calendar .date .ui-datepicker-calendar{width:100%; padding:5px 5px 9px 5px;}
form.form-grid div.calendar .date .ui-datepicker table td{padding:3px;} 
form.form-grid div.calendar .date .ui-datepicker table td span, 
form.form-grid div.calendar .date .ui-datepicker td a{width:100%; display:block; background:#ffffff; color:#434c41; line-height:30px; text-align:center; text-decoration:none;}
form.form-grid div.calendar .date .ui-datepicker table td.ui-datepicker-week-end a{background:#ffffff;}
form.form-grid div.calendar .date .ui-datepicker table td a:hover{cursor:arrow; background:#bd8951; color:#ffffff;}
form.form-grid div.calendar .date .ui-datepicker table.ui-datepicker-calendar a.ui-state-active{background:#51bd89; color:#ffffff;}
form.form-grid div.calendar .date .ui-datepicker table.ui-datepicker-calendar a.ui-state-default.ui-state-highlight:not(.ui-state-active){background:#ffffff; color:#434c41;}
form.form-grid div.calendar .date .ui-datepicker table td.ui-datepicker-unselectable span{background:#f7f7f7;}
form.form-grid div.boats .boat{width:100%; display:grid; grid-template-columns:320px auto; border:1px solid #434c41; border-radius:16px; margin-bottom:32px; cursor:pointer; overflow:hidden;}
form.form-grid div.boats .boat.noclick{pointer-events:none;}
form.form-grid div.boats .boat:last-of-type{margin:0px;}
form.form-grid div.boats .boat:hover{border:1px solid #bd8951;}
form.form-grid div.boats .boat.not-available{border:1px solid #f1f1f2; cursor:not-allowed; pointer-events:none;}
form.form-grid div.boats .boat.checked{border:1px solid #bd8951; background:rgba(19,184,181, 0.1);}
form.form-grid div.boats .boat .image img{width:100%; object-fit:contain;}
form.form-grid div.boats .boat.not-available .image img{-webkit-filter:grayscale(100%); filter:grayscale(100%);}
form.form-grid div.boats .boat .about{padding:24px;}
form.form-grid div.boats .boat .about h3{margin:0px 0px 24px 0px;}
form.form-grid div.boats .boat.checked .about *{color:#bd8951;}


/*header*/
header{}
header.image{height:245px; background:url('../video/deliciis-beans-small.jpg') no-repeat; background-size:cover;}
header video{width:100%; position:relative; z-index:-1;}
header .overlay{}
header .overlay .marker{width:150px; height:50px; display:block; position:fixed; top:35px; z-index:700; background-color:#252525; cursor:pointer;}
header .overlay .marker.left{left:35px;}
header .overlay .marker.right{right:35px;}
header .overlay .marker .icon{width:50px; height:50px; display:block; float:left; background-color:#bd8951; text-align:center;}
header .overlay .marker.right .icon{float:right;}
header .overlay .marker .icon i{font-size:24px; font-size:2.4rem; line-height:50px;}
header .overlay .marker .name{text-align:center; line-height:50px; text-transform:lowercase;}
header .overlay .logo{width:100%; position:absolute; display:flex; top:0; bottom:0;}
header .overlay .logo a{width:315px; display:flex; margin:auto;}
header .overlay .logo a img{width:100%;}
header.image .overlay .logo a{width:208px; height:175px;}

/*nav*/
nav{width:0; height:100%; position:fixed; z-index:1000; top:0; right:0; overflow-x:hidden; transition:0.5s;}
nav.open{width:100%; background:rgba(0,0,0,0.7); transition: 0.7s;}
nav .close{position:absolute; width:50px; height:50px; top:35px; right:35px; font-size:46px; font-size:4.6rem; line-height:50px; text-align:center;}
nav ul{width:300px; height:100%; float:right; background:#131217; padding-top:90px;}
nav ul li{width:100%; height:50px; display:block; padding:5px 35px; box-sizing:border-box;}
nav ul li a{font-size:18px; font-size:1.8rem; line-height:50px;}
nav ul a.on,
nav ul a:hover{color:#bd8951;}

/*main*/
section{padding:70px 0px;}
section.info article{padding:0px 70px; box-sizing:border-box; background:url('../images/coffee-stain.png') no-repeat center; background-size:50%;}
section.info article p a{color:#bd8951;}
section aside{padding:0px 70px; box-sizing:border-box; position:relative;}
section aside div{width:100%;}
section aside img.overlay{width:100%; position:absolute; bottom:0; right:0;}
section aside div.picture img{width:100%;}
section aside div.bronze{padding:35px; box-sizing:border-box; color:#ffffff; text-align:center; background:#bd8951;}
section aside div.bronze h4{font-family:'Nunito', sans-serif; color:#ffffff; text-transform:uppercase; margin-bottom:35px;}

section.products{background:url('../images/hero-thee.jpg') no-repeat center #ffffff; box-shadow:inset 0 0 0 1000px rgba(0,0,0,0.7); background-size:cover;}
section.products h2{color:white; margin-bottom:70px;}
section.products .wrapper{display:grid; grid-template-columns:repeat(3, auto); grid-gap:35px;}
section.products .wrapper .product{display:block; background:#bd8951; text-decoration:none; outline:2px solid white; outline-offset:-15px;}
section.products .wrapper .product .image img{width:100%;}
section.products .wrapper .product .description{padding:0px 32px 32px 32px; box-sizing:border-box; text-align:center; text-transform:lowercase;}
section.products .wrapper .product .description span{width:100%; display:block; font-family:'Amatic SC', cursive; font-size:72px; font-size:7.2rem;}

section.content{padding-bottom:0px;}
section.content h1{font-size:36px; font-size:3.6rem; font-family:'Tinos', cursive;}
section.content .wrapper{display:grid !important; grid-template-columns:repeat(2, 1fr); grid-gap:70px; margin:0px 70px;}
section.content .wrapper p{color:#bd8951;}
section.content .wide{margin:0px 70px;}

section.orderlist .wrapper{display:grid !important; grid-template-columns:repeat(2, 1fr); grid-gap:35px 70px; margin:0px 70px; background:url('../images/coffee-stain.png') no-repeat center; background-size:45%;}
section.orderlist .wrapper .product{padding-bottom:35px; border-bottom:2px dotted #d7d7d7;}
section.orderlist .wrapper .product .product-name{font-family:'Tinos', cursive; color:#393939; font-size:24px; font-size:2.4rem; font-weight:700;}
section.orderlist .wrapper .product .product-name span{font-size:16px; font-size:1.6rem; font-weight:normal; margin-left:35px;}
section.orderlist .wrapper .product .product-name strong{float:right; color:#bd8951;}
section.orderlist .wrapper .product .product-description{padding-top:15px; box-sizing:border-box;font-family:'Tinos', cursive; font-size:16px; font-size:1.6rem; color:#606060;}

section.suggestion{box-shadow:inset 0 0 0 1000px rgba(0,0,0,0.7);}
section.suggestion a.button{background-color:#bd8951; outline:2px solid white; outline-offset:-15px; text-align:center; margin:0px 70px; padding:15px 70px 30px 70px; text-transform:lowercase;}
section.suggestion a.button span{width:100%; line-height:normal; display:block; font-family:'Amatic SC', cursive; font-size:72px; font-size:7.2rem;}

section.gallery{padding-bottom:0px;}
section.gallery h2{margin-bottom:70px;}
section.gallery .wrapper{display:grid; grid-template-columns:repeat(4, auto); grid-gap:0px;}
section.gallery .wrapper .image{display:block;}
section.gallery .wrapper .image img{width:100%;}

section.clear h1.clear{font-family:'Tinos', cursive;}

footer{background:#252525; padding-top:70px; color:#ffffff; text-align:center;}
footer .logo{margin-bottom:35px !important;}
footer .logo img{width:150px; margin:auto;}
footer .contact{margin-bottom:35px !important; line-height:40px;}
footer .contact a:last-of-type{margin-left:20px;}
footer .social i{margin:0px 15px; margin-bottom: 35px !important;}
footer .top{width:50px; height:50px; display:block; position:fixed; bottom:70px; right:35px; z-index:700; background-color:#bd8951; text-align:center;}
footer .top i{color:#ffffff; line-height:50px; font-size:24px; font-size:2.4rem; }
footer .copyright{width:100%; display:inline-grid; padding:10px 0px; background:#1d1d1d; font-size:14px; font-size:1.4rem;}
footer .copyright .wrapper{display:grid; grid-template-columns:repeat(2, 1fr); grid-gap:0px;}
footer .copyright .wrapper .left{text-align:left;}
footer .copyright .wrapper .left a{margin-left:10px;}
footer .copyright .wrapper .right{text-align:right;}

/*big*/
@media only screen and (min-width:1261px)
{
    /*grid*/    
    body{min-width:1260px}.nested{margin:0!important}.container{width:1260px;height:auto;display:block;margin:auto}.grid-1,.grid-10,.grid-11,.grid-12,.grid-2,.grid-3,.grid-4,.grid-5,.grid-6,.grid-7,.grid-8,.grid-9{display:inline;float:left}.pull-1,.pull-10,.pull-11,.pull-2,.pull-3,.pull-4,.pull-5,.pull-6,.pull-7,.pull-8,.pull-9,.push-1,.push-10,.push-11,.push-2,.push-3,.push-4,.push-5,.push-6,.push-7,.push-8,.push-9{position:relative}.container .grid-1{width:105px;margin:0}.container .grid-2{width:210px;margin:0}.container .grid-3{width:315px;margin:0}.container .grid-4{width:420px;margin:0}.container .grid-5{width:525px;margin:0}.container .grid-6{width:630px;margin:0}.container .grid-7{width:735px;margin:0}.container .grid-8{width:840px;margin:0}.container .grid-9{width:945px;margin:0}.container .grid-10{width:1050px;margin:0}.container .grid-11{width:1155px;margin:0}.container .grid-12{width:1260px;margin:0}.first{margin:0 10px 0 0!important}.last{margin:0 0 0 10px!important}.container .prefix-1{padding-left:105px}.container .prefix-2{padding-left:210px}.container .prefix-3{padding-left:315px}.container .prefix-4{padding-left:420px}.container .prefix-5{padding-left:525px}.container .prefix-6{padding-left:630px}.container .prefix-7{padding-left:735px}.container .prefix-8{padding-left:840px}.container .prefix-9{padding-left:945px}.container .prefix-10{padding-left:1050px}.container .prefix-11{padding-left:1155px}.container .suffix-1{padding-right:105px}.container .suffix-2{padding-right:210px}.container .suffix-3{padding-right:315px}.container .suffix-4{padding-right:420px}.container .suffix-5{padding-right:525px}.container .suffix-6{padding-right:630px}.container .suffix-7{padding-right:735px}.container .suffix-8{padding-right:840px}.container .suffix-9{padding-right:945px}.container .suffix-10{padding-right:1050px}.container .suffix-11{padding-right:1155px}.container .push-1{left:105px}.container .push-2{left:210px}.container .push-3{left:315px}.container .push-4{left:420px}.container .push-5{left:525px}.container .push-6{left:630px}.container .push-7{left:735px}.container .push-8{left:840px}.container .push-9{left:945px}.container .push-10{left:1050px}.container .push-11{left:1155px}.container .pull-1{left:-105px}.container .pull-2{left:-210px}.container .pull-3{left:-315px}.container .pull-4{left:-420px}.container .pull-5{left:-525px}.container .pull-6{left:-630px}.container .pull-7{left:-735px}.container .pull-8{left:-840px}.container .pull-9{left:-945px}.container .pull-10{left:-1050px}.container .pull-11{left:-1155px}

}

/*normal*/
@media only screen and (min-width:994px) and (max-width:1260px) 
{
    /*grid*/
    body{min-width:960px}.nested{margin:0!important}.container{width:960px;height:auto;display:block;margin:auto}.grid-1,.grid-10,.grid-11,.grid-12,.grid-2,.grid-3,.grid-4,.grid-5,.grid-6,.grid-7,.grid-8,.grid-9{display:inline;float:left}.pull-1,.pull-10,.pull-11,.pull-2,.pull-3,.pull-4,.pull-5,.pull-6,.pull-7,.pull-8,.pull-9,.push-1,.push-10,.push-11,.push-2,.push-3,.push-4,.push-5,.push-6,.push-7,.push-8,.push-9{position:relative}.container .grid-1{width:80px;margin:0}.container .grid-2{width:160px;margin:0}.container .grid-3{width:240px;margin:0}.container .grid-4{width:320px;margin:0}.container .grid-5{width:400px;margin:0}.container .grid-6{width:480px;margin:0}.container .grid-7{width:560px;margin:0}.container .grid-8{width:640px;margin:0}.container .grid-9{width:720px;margin:0}.container .grid-10{width:800px;margin:0}.container .grid-11{width:880px;margin:0}.container .grid-12{width:960px;margin:0}.first{margin:0 10px 0 0!important}.last{margin:0 0 0 10px!important}.container .prefix-1{padding-left:80px}.container .prefix-2{padding-left:160px}.container .prefix-3{padding-left:240px}.container .prefix-4{padding-left:320px}.container .prefix-5{padding-left:400px}.container .prefix-6{padding-left:480px}.container .prefix-7{padding-left:560px}.container .prefix-8{padding-left:640px}.container .prefix-9{padding-left:720px}.container .prefix-10{padding-left:800px}.container .prefix-11{padding-left:880px}.container .suffix-1{padding-right:80px}.container .suffix-2{padding-right:160px}.container .suffix-3{padding-right:240px}.container .suffix-4{padding-right:320px}.container .suffix-5{padding-right:400px}.container .suffix-6{padding-right:480px}.container .suffix-7{padding-right:560px}.container .suffix-8{padding-right:640px}.container .suffix-9{padding-right:720px}.container .suffix-10{padding-right:800px}.container .suffix-11{padding-right:880px}.container .push-1{left:80px}.container .push-2{left:160px}.container .push-3{left:240px}.container .push-4{left:320px}.container .push-5{left:400px}.container .push-6{left:480px}.container .push-7{left:560px}.container .push-8{left:640px}.container .push-9{left:720px}.container .push-10{left:800px}.container .push-11{left:880px}.container .pull-1{left:-80px}.container .pull-2{left:-160px}.container .pull-3{left:-240px}.container .pull-4{left:-320px}.container .pull-5{left:-400px}.container .pull-6{left:-480px}.container .pull-7{left:-560px}.container .pull-8{left:-640px}.container .pull-9{left:-720px}.container .pull-10{left:-800px}.container .pull-11{left:-880px}

    header .overlay .logo a{width:250px;}
    section.info article{padding:0px 35px 0px 70px;}
    section aside{padding:0px 70px 0px 35px;}
    section aside div.bronze{padding:20px; font-size:16px; font-size:1.6rem;}
    section aside div.bronze h4{margin-bottom:20px;}    

    section.content .wrapper{ grid-gap:50px; margin:0px 50px; }
    section.content .wrapper p{font-size:16px; font-size:1.6rem;}
    
    section.surgestion a.button{margin:0px 50px;}

    section.orderlist .wrapper{margin:0px 50px;}
    section.orderlist .wrapper .product{padding-bottom:35px; border-bottom:2px dotted #d7d7d7;}
    section.orderlist .wrapper .product .product-name strong{font-size:20px; font-size:2.0rem;}
    section.orderlist .wrapper .product .product-description{padding-top:15px; box-sizing:border-box;font-family:'Tinos', cursive; font-size:16px; font-size:1.6rem; color:#606060;}
}

/*medium*/
@media only screen and (max-width:994px) 
{
    /*grid*/
    .container{width:100%!important}.grid-1,.grid-10,.grid-11,.grid-12,.grid-2,.grid-3,.grid-4,.grid-5,.grid-6,.grid-7,.grid-8,.grid-9{display:inline;float:left}.container .grid-1{width:8.333333333333333%;margin:0}.container .grid-2{width:16.66666666666667%;margin:0}.container .grid-3{width:25%;margin:0}.container .grid-4{width:33.33333333333333%;margin:0}.container .grid-5{width:41.66666666666667%;margin:0}.container .grid-6{width:50%;margin:0}.container .grid-7{width:58.33333333333333%;margin:0}.container .grid-8{width:66.66666666666667%;margin:0}.container .grid-9{width:75%;margin:0}.container .grid-10{width:83.33333333333333%;margin:0}.container .grid-11{width:91.66666666666667%;margin:0}.container .grid-12{width:100%;margin:0}.first{margin:0 5px 0 0!important}.last{margin:0 0 0 5px!important}.container .prefix-1{padding-left:8.333333333333333%}.container .prefix-2{padding-left:16.66666666666667%}.container .prefix-3{padding-left:25%}.container .prefix-4{padding-left:33.33333333333333%}.container .prefix-5{padding-left:41.66666666666667%}.container .prefix-6{padding-left:50%}.container .prefix-7{padding-left:58.33333333333333%}.container .prefix-8{padding-left:66.66666666666667%}.container .prefix-9{padding-left:75%}.container .prefix-10{padding-left:83.33333333333333%}.container .prefix-11{padding-left:91.66666666666667%}.container .suffix-1{padding-right:8.333333333333333%}.container .suffix-2{padding-right:16.66666666666667%}.container .suffix-3{padding-right:25%}.container .suffix-4{padding-right:33.33333333333333%}.container .suffix-5{padding-right:41.66666666666667%}.container .suffix-6{padding-right:50%}.container .suffix-7{padding-right:58.33333333333333%}.container .suffix-8{padding-right:66.66666666666667%}.container .suffix-9{padding-right:75%}.container .suffix-10{padding-right:83.33333333333333%}.container .suffix-11{padding-right:91.66666666666667%}.container .push-1{left:8.333333333333333%}.container .push-2{left:16.66666666666667%}.container .push-3{left:25%}.container .push-4{left:33.33333333333333%}.container .push-5{left:41.66666666666667%}.container .push-6{left:50%}.container .push-7{left:58.33333333333333%}.container .push-8{left:66.66666666666667%}.container .push-9{left:75%}.container .push-10{left:83.33333333333333%}.container .push-11{left:91.66666666666667%}.container .pull-1{left:-18.333333333333333%}.container .pull-2{left:-16.66666666666667%}.container .pull-3{left:-25%}.container .pull-4{left:-33.33333333333333%}.container .pull-5{left:-41.66666666666667%}.container .pull-6{left:-50%}.container .pull-7{left:-58.33333333333333%}.container .pull-8{left:-66.66666666666667%}.container .pull-9{left:-75%}.container .pull-10{left:-83.33333333333333%}.container .pull-11{left:-91.66666666666667%}

    body{font-size:16px; font-size:1.6rem;}
    h1.big{font-size:60px; font-size:6.0rem;}

    /*steps*/
    .progress{padding:0px 24px; height:48px; box-sizing:border-box;}
    .steps{height:24px;}
    .steps .bg{top:12px;}
    .steps .steps-inner .step{height:24px;}
    .steps .steps-inner .step .step-inner{width:24px; height:24px; border-radius:24px; border:2px solid #222222; line-height:24px; font-size:1.6rem;}
    .steps .steps-inner .step .step-inner.active{border:2px solid #bd8951;}
    form.form-grid div.boats .boat{grid-template-columns:220px auto; }
    form.form-grid div.boats .boat .about{padding:16px;}
    form.form-grid div.boats .boat .about h3{margin:0px 0px 12px 0px;}

    header .overlay .marker{width:105px; height:35px; top:20px;}
    header .overlay .marker.left{left:20px;}
    header .overlay .marker.right{right:20px;}
    header .overlay .marker .icon{width:35px; height:35px;}
    header .overlay .marker .icon i{font-size:18px; font-size:1.8rem; line-height:35px;}
    header .overlay .marker .name{line-height:35px; font-size:16px; font-size:1.6rem;}
    header .overlay .logo a{width:200px;}
    
    nav .close{width:35px; height:35px; top:20px; right:20px; font-size:36px; font-size:3.6rem; line-height:35px;}
    nav ul{padding-top:75px;}    
    
    section{padding:50px 0px;}
    section.info article{padding:0px 25px 0px 50px;}
    section aside{padding:0px 50px 0px 25px;}
    section aside div.bronze{padding:20px;}
    section aside div.bronze h4{margin-bottom:20px;}    

    section.products h2{margin-bottom:50px;}
    section.products .wrapper{padding:0px 35px;}
    section.products .wrapper .product{outline:1px solid white;}
    section.products .wrapper .product .description span{font-size:60px; font-size:6.0rem;}    

    section.content h1{font-size:30px; font-size:3.0rem;}
    section.content .wrapper{ grid-gap:50px; margin:0px 50px; }
    
    section.orderlist .wrapper{grid-gap:35px 50px; margin:0px 50px;}
    section.orderlist .wrapper .product .product-name{font-size:20px; font-size:2.0rem;}
    section.orderlist .wrapper .product .product-name span{font-size:16px; font-size:1.6rem; font-weight:normal; margin-left:35px;}
    section.orderlist .wrapper .product .product-name strong{font-size:18px; font-size:1.8rem;}
    section.orderlist .wrapper .product .product-description{padding-top:15px;}
    
    section.suggestion a.button{margin:0px 50px;}
    section.suggestion a.button span{font-size:60px; font-size:6.0rem;}
    
    section.gallery h2{margin-bottom:50px;}

    footer{padding-top:50px}
    footer .logo{margin-bottom:35px !important;}
    footer .logo img{width:100px;}
    footer .contact{margin-bottom:35px !important;}
    footer .top{width:35px; bottom:20px; right:20px;}
    footer .top i{line-height:35px; font-size:18px; font-size:1.8rem;}
}

/*small*/
@media only screen and (max-width:784px)
{
    /*grid*/
    body{min-width:0}.nested{margin:0!important}.container{width:100%!important}.grid-1,.grid-10,.grid-11,.grid-12,.grid-2,.grid-3,.grid-4,.grid-5,.grid-6,.grid-7,.grid-8,.grid-9{width:100%;clear:both;float:none;margin:auto;display:inline-block;zoom:1}.grid_1 .grid_1,.grid_10 .grid_1,.grid_10 .grid_10,.grid_10 .grid_2,.grid_10 .grid_3,.grid_10 .grid_4,.grid_10 .grid_5,.grid_10 .grid_6,.grid_10 .grid_7,.grid_10 .grid_8,.grid_10 .grid_9,.grid_11 .grid_1,.grid_11 .grid_10,.grid_11 .grid_11,.grid_11 .grid_2,.grid_11 .grid_3,.grid_11 .grid_4,.grid_11 .grid_5,.grid_11 .grid_6,.grid_11 .grid_7,.grid_11 .grid_8,.grid_11 .grid_9,.grid_12 .grid_1,.grid_12 .grid_10,.grid_12 .grid_11,.grid_12 .grid_12,.grid_12 .grid_2,.grid_12 .grid_3,.grid_12 .grid_4,.grid_12 .grid_5,.grid_12 .grid_6,.grid_12 .grid_7,.grid_12 .grid_8,.grid_12 .grid_9,.grid_2 .grid_1,.grid_2 .grid_2,.grid_3 .grid_1,.grid_3 .grid_2,.grid_3 .grid_3,.grid_4 .grid_1,.grid_4 .grid_2,.grid_4 .grid_3,.grid_4 .grid_4,.grid_5 .grid_1,.grid_5 .grid_2,.grid_5 .grid_3,.grid_5 .grid_4,.grid_5 .grid_5,.grid_6 .grid_1,.grid_6 .grid_2,.grid_6 .grid_3,.grid_6 .grid_4,.grid_6 .grid_5,.grid_6 .grid_6,.grid_7 .grid_1,.grid_7 .grid_2,.grid_7 .grid_3,.grid_7 .grid_4,.grid_7 .grid_5,.grid_7 .grid_6,.grid_7 .grid_7,.grid_8 .grid_1,.grid_8 .grid_2,.grid_8 .grid_3,.grid_8 .grid_4,.grid_8 .grid_5,.grid_8 .grid_6,.grid_8 .grid_7,.grid_8 .grid_8,.grid_9 .grid_1,.grid_9 .grid_2,.grid_9 .grid_3,.grid_9 .grid_4,.grid_9 .grid_5,.grid_9 .grid_6,.grid_9 .grid_7,.grid_9 .grid_8,.grid_9 .grid_9{padding-left:0;padding-right:0}.container .pull_1,.container .pull_10,.container .pull_11,.container .pull_2,.container .pull_3,.container .pull_4,.container .pull_5,.container .pull_6,.container .pull_7,.container .pull_8,.container .pull_9,.container .push_1,.container .push_10,.container .push_11,.container .push_2,.container .push_3,.container .push_4,.container .push_5,.container .push_6,.container .push_7,.container .push_8,.container .push_9{left:0}

    header.image{height:200px;}
    header .overlay .marker{top:15px;}
    header .overlay .marker.left{left:15px;}
    header .overlay .marker.right{right:15px;}    
    header .overlay .logo a{width:150px;}
    header.image .overlay .logo a{width:119px; height:100px;}
   
    nav ul{width:250px;}
    
    section{padding:35px 0px;}
    section.info article{width:100% !important; padding:0px 35px;}
    section aside{width:100% !important; padding:35px; display:flex !important;}
    section aside div.picture{width:50%; float:left; flex:1;}
    section aside div.picture img{width:100%;}
    section aside div.bronze{width:50%; flex:1; float:right; padding:35px; box-sizing:border-box; color:#ffffff; text-align:center; background:#bd8951;}
    section aside div.bronze h4{font-family:'Nunito', sans-serif; color:#ffffff; text-transform:uppercase; margin-bottom:35px;}

    section.products h2{margin-bottom:35px;}
    section.products .wrapper{grid-template-columns:repeat(1, auto);}

    section.content h1{font-size:30px; font-size:3.0rem;}
    section.content .wrapper{ grid-template-columns:repeat(1, auto); grid-gap:35px; margin:0px 35px; }
    section.content .wrapper p{margin-bottom:0px }

    section.orderlist .wrapper{grid-template-columns:repeat(1, 1fr); margin:0px 35px; grid-gap:15px 50px;}
    section.orderlist .wrapper .product{padding-bottom:15px;}
    section.orderlist .wrapper .product .product-name span {font-size:14px; font-size:1.4rem; margin-left:15px;}
    section.orderlist .wrapper .product .product-name strong { font-size:16px; font-size:1.6rem;} 
   
    section.suggestion{text-align:center;}
    section.suggestion a.button{width:200px; display:block; margin:0px auto; padding:15px 50px 25px 50px; float:unset !important;}
    
    section.gallery h2{margin-bottom:35px;}
    section.gallery .wrapper{grid-template-columns:repeat(2, auto);}
    
    footer .grid-4{width:100% !important; padding:0px !important;}
    footer .top{width:35px; height:35px; bottom:15px; right:15px;}
    footer .copyright .wrapper{grid-template-columns:repeat(1, 1fr);}
    footer .copyright .wrapper div{text-align:center !important;}

}

/*mini*/
@media only screen and (max-width:479px)
{
    /*grid*/
    .container{width:100%!important}.nested{margin:0!important}.container .grid_1,.container .grid_10,.container .grid_11,.container .grid_12,.container .grid_2,.container .grid_3,.container .grid_4,.container .grid_5,.container .grid_6,.container .grid_7,.container .grid_8,.container .grid_9{width:260px}

    body,h3{font-size:14px; font-size:1.4rem;}
    h1.big{font-size:48px; font-size:4.8rem;}
    h2{font-size:28px; font-size:2.8rem;}    
    
    form.form-grid{width:100%; padding:15px; box-sizing:border-box; grid-template-columns:1fr; }
    form.form-grid .wide{grid-column-end:unset;}
    form.form-grid div.row.label{border-bottom:none; padding:0px;}
    form.form-grid div.calendar{padding:0px 0px 15px 0px;}
    form.form-grid div.calendar .date .ui-datepicker{grid-template-columns:1fr; grid-gap:15px;}
    form.form-grid div.boats .boat{grid-template-columns:1fr;}

    header .overlay .marker{width:35px; height:35px; top:15px;}
    header .overlay .marker.left{left:15px;}
    header .overlay .marker.right{right:15px;}
    header .overlay .marker .name{display:none;}
    header .overlay .logo a{width:100px;}    
    
    nav ul li{height:40px;}
    nav ul li a{line-height:40px;}    
    
    section{padding:15px 0px;}
    section.info article{padding:0px 15px;}
    section aside{padding:15px;}
    section aside div.bronze{padding:15px;}
    section aside div.bronze h4{margin-bottom:15px;}    
    
    section.products h2{margin-bottom:15px;}
    section.products .wrapper{grid-gap:15px; padding:0px 15px;}
    section.products .wrapper .product{outline-offset:-10px;}
    section.products .wrapper .product .description{padding:0px 26px 26px 26px; box-sizing:border-box; text-align:center; text-transform:lowercase;}
    section.products .wrapper .product .description span{font-size:48px; font-size:4.8rem;}    

    section.content h1{font-size:24px; font-size:2.4rem;}
    section.content .wrapper{ grid-gap:15px; margin:0px 15px; }
    section.content .wrapper p{margin-bottom:0px; font-size:14px; font-size:1.4rem;}
    
    section.suggestion a.button{width:150px;}
    section.suggestion a.button span{font-size:48px; font-size:4.8rem;}
    
    section.orderlist .wrapper {margin:0px 15px;}
    section.orderlist .wrapper .product {padding-bottom:15px;}
    
    section.gallery h2{margin-bottom:15px;}
}