/*QUINCONTINGUT*//*QUINCONTINGUT*//*QUINCONTINGUT*/
@media only screen and (max-width: 767px) {
.quincon_parent_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
padding: 0rem 0rem 0rem 0rem;
height: auto;
min-height: 100vh;
text-align: center;
background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.95)), url("../images/backgrounds/quincontingut-bg.jpg");
background-size: cover;
background-repeat: no-repeat;
background-position: bottom;
max-width: calc(100% - 8px);
margin: 4px 4px 4px 4px;
}
.quincon_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: stretch;
width: 100%;
max-width: calc(100% - 8px);
margin-right: auto;
margin-left: 0;
padding: 0rem 0rem 0rem 0rem;
min-height: 100vh;
}
.quincon_h2 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: space-between;
align-items: center;
width: 100%;
margin-right: 0;
margin-left: auto;
align-self: center;
max-width: calc(100% - 8px);
font-size: 1.1rem;
}
.quincon_h2_span {
display: block;
width: 100%;
max-width: calc(85% - 8px);
margin: auto auto auto 4px;
color: #f7ffff;
text-align: left;
}
.smiley {
display: block;
width: 100%;
height: auto;
margin: auto 4px auto 0;
max-width: calc(15% - 8px);
align-self: end;
}
.smiley svg {
display: inline-block;
width: 100%;
height: auto;
}
/*
.quincon_h2_span svg {
vertical-align: middle;
}
*/
.quincon_p_1, .quincon_p_2 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: auto;
text-align: center;
font-size: 1.3rem;
max-width: calc(100% - 8px);
}
.quincon_p_1 {
align-items: stretch;
}
.quincon_p_2 {
align-items: stretch;
}
.quincon_p_1 > span, .quincon_p_2 > span {
width: 100%;
max-width: calc(100% - 0px);
text-align: left;
margin-left: auto;
}
.quincon_p_3_cnt_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: space-around;
align-items: start;
width: calc(100% - 16px);
/* min-height: 56vh; */
color: #f7ffff;
text-align: left;
}
.quincon_p_3_cnt_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: start;
width: calc(100% - 8px);
color: #f7ffff;
text-align: left;
align-self: start;
min-height: 15vh;
margin-left: auto;
font-size: 1.2rem;
}
.quincon_p_3 {
width: calc(100% - 16px);
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: 0;
padding: 1rem 0rem 0rem 0rem;
/* font-weight: 400; */
max-width: 27em;
}
}
/*MOBILES⬆︎⬆︎⬆︎*/
/*DESKTOP⬇︎⬇︎⬇︎*/
@media only screen and (min-width: 768px) {
.quincon_parent_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 0rem 0rem 0rem 0rem;
min-height: 100vh;
text-align: center;
background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.95)), url("../images/backgrounds/quincontingut-bg.jpg");
background-size: cover;
background-repeat: no-repeat;
background-position: bottom;
max-width: calc(100% - 8px);
margin: 4px;
}
.quincon_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
align-items: center;
width: calc(100% - 16px);
max-width: 100%;
margin-right: auto;
margin-left: auto;
padding: 0rem 0rem 0rem 0rem;
min-height: 100vh;
}
.quincon_h2 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: center;
width: 100%;
margin: auto auto 0 auto;
align-self: center;
text-align: left;
max-width: calc(100% - 0px);
font-size: 1.2rem;
}
.quincon_h2_span {
display: block;
width: auto;
max-width: calc(100% - 64px);
margin: auto auto auto 0;
color: #f7ffff;
align-self: start;
text-align: left;
}
.horizontal_circled {
background-image: url("../images/backgrounds/circular-horizontal.svg");
background-size: 100% auto;
background-repeat: no-repeat;
background-position: 0px 0px;
background-clip: padding-box;
}
.smiley {
display: block;
width: 100%;
height: auto;
margin: auto 0 0 0;
padding-right: 8px;
max-width: 56px;
align-self: end;
}
.smiley svg {
display: inline-block;
width: 100%;
height: auto;
vertical-align: bottom;
}
/*
.quincon_h2_span svg {
max-width: 100%;
vertical-align: middle;
}
*/
.quincon_p_1, .quincon_p_2 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: start;
width: 50%;
margin-top: auto;
margin-right: auto;
margin-bottom: 0;
margin-left: 0;
/* min-height: 33vh; */
max-width: calc(50% - 8px);
font-size: 1.6rem;
}
.quincon_p_1 > span, .quincon_p_2 > span {
width: 100%;
max-width: calc(100% - 0px);
text-align: left;
min-height: 15vh;
}
.quincon_p_1 > span > svg, .quincon_p_2 > span > svg {
width: calc(100% - 16px);
max-width: 416px;
vertical-align: middle;
}
.quincon_p_3_cnt_div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: start;
align-items: start;
width: calc(100% - 0px);
margin-top: 0;
margin-right: auto;
margin-bottom: auto;
margin-left: 0;
/* min-height: 20vh; */
color: #f7ffff;
text-align: left;
align-self: start;
font-size: 1.2rem;
}
.quincon_p_3 {
width: calc(100% - 16px);
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
max-width: 60%;
/* font-weight: 600; */
}
}