@charset "utf-8";

.container.email-marketing{
padding:  40px 0;
}
.email-marketing-price{
margin: 20px 0;
}
.packageg-box-row {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
}
.packageg-box-row .col-md-3 {
    display: flex;
    padding: 0 10px;
    margin-bottom: 20px;
}

.mailmarketing-table {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: baseline;
    border: 1px solid #CCC;
}
.mailmarketing-col {
    display: flex;
    width: 100%;
    align-items: baseline;
    justify-content: space-between;
    padding: 10px;
}
.mailmarketing-col.time {
    background: #ECF0F1;
}
.mailmarketing-col.header {
    background-color: #C0392B;
    color: #FFF;
    justify-content: center;
}
.mailmarketing-col.price {
    background-color: #e74c3c;
    color: #FFF;
    justify-content: center;
font-size: 30px;
font-weight: normal;
}
.mailmarketing-col.submit{
border-top: 1px solid #CCC;
}
.container.spacial,
.container.template{
padding: 40px 0;
}
.knowlead{
border:1px solid #dedede;
padding:0 10px;
background-color:#f3f3f3;
}

@media screen and (max-width:1024px) {
.mailmarketing-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
}
.container.spacial, .container.template, .container.email-marketing {
    padding: 20px;
}
}

@media screen and (max-width:768px) {
.container.email-marketing{
padding: 40px 0;
}
.container.email-marketing .main-header{
padding: 0 20px;
}
.packageg-box-row {
    display: flex;
    overflow: auto;
    flex: none;
    width: auto;
    flex-flow: row nowrap;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    margin: 0;
    -webkit-appearance: none;
}
.packageg-box-row::-webkit-scrollbar{
display: none;
}
.packageg-box-row .col-md-3 {
    display: flex;
    padding: 0 0 0 20px;
    margin: 0;
    position: relative;
    scroll-snap-align: start;
    flex: none;
    color: #222;
    align-content: flex-start;
    width: calc((100%) / 2.15);
    text-align: center;
}
.packageg-box-row .col-md-3:last-child{
margin-right: 20px;
}
.email-marketing-comment{
padding: 0 20px;
}
.knowlead{
margin-top: 20px;
}
.best-hosting-box .row,
.container.template .row{
margin: 0;
}
.best-hosting-box [class*="col-md"],
.container.template .col-md-6{
padding: 0;
}
}

@media screen and (max-width:767px) and (orientation:portrait) {
.packageg-box-row .col-md-3 {
    width: calc((100%) / 1.15);
}
}