.panel-wrapper * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.panel-wrapper {
position: fixed;
left: 0;
bottom: 0;
overflow: hidden;
/*width: 45% !important;*/
font-family: sans-serif;
}
.panel-controller {
position: relative;
overflow: hidden;
width: 100%;
}
.tab-controller {
float: left;
margin-left: 50px;
padding: 5px 10px 5px;
background-color: #ffa320;
-webkit-border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;
height:34px;
}
.tab-controller * {
display: block;
/*font-family: sans-serif;*/
font-size: 28px;
font-weight: bold;
color: white;
cursor: pointer;
}
.tab-controller .show {
display: none;
}
.panel-content {
overflow: hidden;
width: 95% !important;
background-color: #f3f3f3;
margin-left:50px;
}
.panel-content .content {
overflow: hidden;
margin: 0 auto;
max-width: 900px;
width: 98%;
}
.panel-content p {
    margin-top:10px;
    font-family:'Open Sans' !important;
    text-align:center;
    font-size:12px;
    color:#333;
    font-weight:600;
}
.panel-content .content .features {
overflow: hidden;
float: right;
border: 2px solid #cb3f59;
margin: 5px auto;
padding: 5px;
width: 40%; /* 360 / 900 */
background-color: #de929f;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.panel-content .content .features .row {
overflow: hidden;
margin: 5px auto;
width: 100%;
}
.panel-content .content .features .row .feature {
overflow: hidden;
float: left;
margin: 0 1%;
width: 48%;
height: 50px;
background-color: white;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.panel-content .content .features .row .feature .icon {
overflow: hidden;
float: left;
margin: 0 auto 0 2%;
padding-top: 2px;
width: 27.4390243902439%; /* 45/164 */
height: 100%;
}
.panel-content .content .features .row .feature .icon img {
display: block;
width: 100%;
}
.panel-content .content .features .row .feature .description {
overflow: hidden;
float: left;
margin: 0 2% 0 auto;
padding-top: 5px;
width: 68.5609756097561%; /* 119/164 */
height: 100%;
text-align: center;
}
.panel-content .content .features .row .feature .description span {
font-size: 12px;
font-weight: bold;
color: #5c1223;
}
.panel-content .content .payment {
overflow: hidden;
float: right;
border: 2px solid #cb3f59;
margin: 5px 2%;
padding: 5px;
width: 40%; /* 360 / 900 */
background-color: #de929f;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.panel-content .content .payment .payment-unit {
overflow: hidden;
float: left;
margin: 0 4.86111111111111%;
width: 40.27777777777778%; /* 145 / 360 */
background-color: pink;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.panel-content .content .payment .payment-unit .price {
margin: 5px auto 0;
text-align: center;
color: #5c1422;
font-size: 30px;
font-weight: bold;
}
.panel-content .content .payment .payment-unit .period {
margin: 0 auto;
text-align: center;
color: #5c1422;
font-size: 15px;
font-weight: bold;
}
.panel-content .content .payment .payment-unit .additional-message {
margin: 2px auto;
text-align: center;
color: #5c1422;
font-size: 12px;
font-weight: bold;
}
.red-background {
background-color: #791A2B;
}
.green-background {
background-color: #1A550D;
}
.panel-content .content .payment .payment-unit .payment-type {
overflow: hidden;
margin: 5px auto;
width: 98px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
text-align: center;
}
.panel-content .content .payment .payment-unit .payment-type a {
text-decoration: none;
}
.panel-content .content .payment .payment-unit .payment-type .message {
display: block;
margin: 2px auto;
color: white;
font-size: 10px;
font-weight: bold;
}
.panel-content .content .payment .payment-unit .payment-type .type {
display: block;
margin: 4px auto;
color: white;
font-size: 13px;
font-weight: bold;
}
.panel-content .content .payment .secure-payment-message {
overflow: hidden;
margin: 3px auto 0;
width: 98%;
text-align: center;
clear: both;
}
.panel-content .content .payment .secure-payment-message span {
color: #5c1422;
font-size: 12px;
font-weight: bold;
}
.clearfix:before, .clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
