/*QUEPROPOSEM*//*QUEPROPOSEM*//*QUEPROPOSEM*/
@media only screen and (max-width: 767px) {
.queprop_parent_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
padding: 0rem 0rem 0rem 0rem;
text-align: center;
max-width: calc(100% - 8px);
margin: 0px 4px 0px 4px;
}
.queprop_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: calc(100% - 0px);
max-width: 100%;
margin-right: auto;
margin-left: auto;
padding: 0rem 0rem 0rem 0rem;
min-height: calc(100vh - 3rem);
}
.box1 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
/* min-height: 30vh; */
max-width: 100%;
text-align: left;
align-self: center;
aspect-ratio: 254 / 119 auto;
}
.x1 {
display: block;
width: 100%;
/* margin-top: auto; */
margin-right: 0px;
/* margin-bottom: auto; */
margin-left: 0px;
padding-top: 0rem;
padding-right: 0;
padding-bottom: 0rem;
padding-left: 0;
height: auto;
/* min-height: 100vw; */
max-width: calc(100% - 0px);
align-self: center;
background-position: center;
background-size: 100% auto;
background-repeat: no-repeat;
background-image: url(../images/backgrounds/queprop508x238.jpg);
aspect-ratio: 254 / 119 auto;
}
.box2, .x2, .box3, .x3 {
display: none;
max-width: 0%;
}
.x2, .x3 {
background-image: none;
}
.box4 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
/* padding-top: 16px; */
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
max-width: 100%;
/* min-height: 10vh; */
/* align-self: center; */
font-size: 1.3rem;
}
.box4a {
display: block;
width: 100%;
margin-top: auto;
margin-right: 0;
margin-bottom: auto;
margin-left: 4px;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
max-width: calc(100% - 4px);
text-align: left;
line-height: 1.8;
}
.box5 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: end;
width: 100%;
margin-top: 8px;
margin-right: auto;
margin-bottom: 0px;
margin-left: 8px;
padding-top: 12px;
padding-right: 0;
padding-bottom: 4px;
padding-left: 0;
text-align: left;
max-width: calc(100% - 8px);
/* min-height: 20vh; */
font-size: 1.2rem;
}
.box5a {
display: block;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0px;
height: auto;
text-align: left;
max-width: calc(100% - 0px);
}
.queprop_lifeline_doodle_span {
display: block;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: auto;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 8px;
height: auto;
text-align: left;
max-width: 80px;
order: 6;
}
.box_tit {
display: block;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
text-align: left;
}
.box_body {
display: inline-block;
width: calc(100% - 0rem);
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
/* vertical-align: top; */
text-align: left;
}
.box_body_attention {
display: inline-block;
width: auto;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
}
.ul_flex_parent_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0px;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
max-width: calc(100% - 0px);
text-align: left;
min-height: 15vh;
}
.queprop_ul {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 24px;
text-align: left;
min-height: 0vh;
max-width: calc(100% - 24px);
font-size: 1.2rem;
}
.box_l_i {
margin-top: auto;
margin-right: 0;
margin-bottom: auto;
margin-left: 0;
padding-top: 8px;
padding-right: 0;
padding-bottom: 8px;
padding-left: 0;
height: auto;
text-align: left;
max-width: calc(100% - 8px);
min-height: 7vh;
}
.order_1sm {
order: 1;
}
.order_2sm {order: 2;}
.order_3sm {order: 3;}
.order_4sm {order: 4;}
.order_5sm {order: 5;}
}
/*MOBILES⬆︎⬆︎⬆︎*/
/*DESKTOP⬇︎⬇︎⬇︎*/
@media only screen and (min-width: 768px) {
.queprop_parent_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: space-between;
align-items: start;
width: 100%;
padding: 0rem 0rem 0rem 0rem;
text-align: center;
max-width: calc(100% - 8px);
margin: 4px;
max-width: calc(100% - 4px);
margin: 4px 0 4px auto;
}
.queprop_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: calc(100% - 0px);
max-width: 100%;
/* margin-right: auto; */
/* margin-left: auto; */
padding: 0rem 0rem 0rem 0rem;
min-height: calc(100vh - 0rem);
}
.box1 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: start;
max-width: 40%;
text-align: left;
/* align-self: start; */
}
.box2 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: start;
max-width: 30%;
text-align: left;
/* align-self: start; */
}
.box3 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: start;
max-width: 30%;
text-align: left;
/* align-self: start; */
}
.box1, .box2, .box3 {
width: 100%;
margin-top: 0;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
/* min-height: 30vh; */
}
.x1, .x2, .x3 {
display: block;
width: 100%;
margin-top: 0;
margin-right: 0px;
margin-bottom: 2px;
margin-left: 0px;
padding-top: 0rem;
padding-right: 0;
padding-bottom: 0rem;
padding-left: 0;
height: auto;
/* min-height: 30vh; */
max-width: calc(100% - 0px);
/* align-self: start; */
background-position: 0px 0px;
background-size: calc(100% - 4px);
background-repeat: no-repeat;
}
.x1 {
aspect-ratio: 254 / 119 auto;
background-image: url(../images/backgrounds/queprop508x238.jpg);
}
.x2 {
aspect-ratio: 190 / 119 auto;
background-image: url(../images/backgrounds/queprop380x238a.jpg);
}
.x3 {
aspect-ratio: 190 / 119 auto;
background-image: url(../images/backgrounds/queprop380x238b.jpg);
}
.box4 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
/* margin-top: auto; */
margin-right: 0;
/* margin-bottom: auto; */
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
max-width: 100%;
/* min-height: 30vh; */
align-self: end;
}
.box4a {
display: block;
width: 100%;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: 42px;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
max-width: calc(32em - 42px);
text-align: left;
line-height: 1.2;
}
.box5 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
/* margin-top: auto; */
margin-right: auto;
/* margin-bottom: auto; */
margin-left: 40px;
padding-top: 0;
padding-right: 0;
padding-bottom: 16px;
padding-left: 0;
text-align: left;
max-width: calc(100% - 40px);
/* min-height: 20vh; */
font-size: 1.2rem;
}
.box5a {
display: block;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 8px;
height: auto;
text-align: left;
max-width: calc(32em - 8px);
}
.queprop_lifeline_doodle_span {
display: block;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: auto;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 8px;
height: auto;
text-align: left;
max-width: 80px;
}
.box_tit {
display: block;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
text-align: left;
}
.box_body {
display: inline-block;
width: calc(100% - 0rem);
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
vertical-align: top;
text-align: left;
}
.box_body_attention {
display: inline-block;
/* width: calc(100% - 0rem); */
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 4px;
padding-right: 0;
padding-bottom: 4px;
padding-left: 0;
height: auto;
/* vertical-align: top; */
text-align: left;
text-indent: -2px;
/* font-size: 1.2em; */
}
.ul_flex_parent_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: start;
width: 100%;
margin-top: auto;
margin-right: 0;
margin-bottom: auto;
margin-left: 16px;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
max-width: calc(50% - 40px);
text-align: left;
min-height: 15vh;
}
.queprop_ul {
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
text-align: left;
min-height: 0vh;
max-width: calc(100% - 0px);
font-size: 1.2rem;
}
.box_l_i {
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: auto;
vertical-align: top;
text-align: left;
max-width: calc(32em - 40px);
}
}