Template:Marburg/CSS

@font-face {

font-family: Poppins-Regular;
src: url('../fonts/Poppins/Poppins-Regular.ttf');

}

@font-face {

font-family: Poppins-Bold;
src: url('../fonts/Poppins/Poppins-Bold.ttf');

}

@font-face {

font-family: Lato-Regular;
src: url('../fonts/Lato/Lato-Regular.ttf');

}

@font-face {

font-family: Lato-Bold;
src: url('../fonts/Lato/Lato-Bold.ttf');

}

.contact100-form {

width: 100%;

}

.s1-txt1 {

font-family: Poppins-Regular;
font-size: 16px;
line-height: 1.5;
color: #555555;

}

.s1-txt2 {

font-family: Poppins-Regular;
font-size: 15px;
line-height: 1.5;
color: #555555;

}

.s2-txt2 {

font-family: Lato-Bold;
font-size: 15px;
line-height: 1.5;
color: #fff;

}

.s2-txt3 {

font-family: Lato-Regular;
font-size: 14px;
line-height: 1.5;
color: #999999;

}

.m1-txt3 {

font-family: Poppins-Bold;
font-size: 30px;
line-height: 1.5;
color: #555555;

}

.m1-txt4 {

font-family: Poppins-Regular;
font-size: 22px;
line-height: 1.5;
color: #555555;

}

.size1 {

width: 100%;
min-height: 100vh;

}

.size2 {

height: 100%;
width: 67%;

}

.size2_5 {

height: 100%;
width: 40%;

}

.size3 {

max-width: 650px;
min-height: 100vh;

}

.size4 {

width: 100%;
height: 50px;

}

.size5 {

width: 36px;
height: 36px;

}

.wsize2 {

max-width: 380px;

}

.bg0 {background-color: #fff;} .bg1 {background-color: #57b846;} .bg3 {background-color: #3b5998;} .bg4 {background-color: #1da1f2;} .bg5 {background-color: #cd201f;} .bg6 {background-color: #4285F4;}

.bg-img1 {

background-position: center;
background-repeat: no-repeat;
background-size: cover;

}

.bg-img2 {

background-position: center;
background-repeat: no-repeat;
background-size: 100% auto;

}

.bor1 {

border-radius: 5px;

}

.where1-parent {

position: relative;
z-index: 1;

}

.where1 {

position: absolute;
z-index: -1;
top: 0;
right: 0;

}

.where2 {

padding: 50px 50px 150px 320px;

}

.how1 {

border-radius: 50%;
font-size: 22px;
color: #fff;

} .how1: hover {

background-color: #555555;
color: #fff;

}

.overlay1 {

overflow: hidden;

}

.overlay1: : before {

content: "";
display: block;
position: absolute;
z-index: -3;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.8);

}

.overlay1: : after {

content: "";
display: block;
position: absolute;
z-index: -2;
top: 0;
right: 100%;
width: 10000px;
height: 100%;
background-color: #fff;
transform-origin: bottom right;
-webkit-transform: skewX(156deg);
-moz-transform: skewX(156deg);
-ms-transform: skewX(156deg);
-o-transform: skewX(156deg);
transform: skewX(156deg);

}

.wrap-pic1 {

width: 50%;

} .wrap-pic1 img {

max-width: 100%;

}

.hov1: hover {

background-color: #555555;

}

@media (max-width: 1600px) {

.respon1 {
max-width: 38%;
}

}

@media (max-width: 1200px) {

.respon1 {
padding-left: 30px;
padding-right: 30px;
}

}

@media (max-width: 992px) {

.respon1 {
max-width: 650px;
min-height: unset;
padding-top: 0;
margin-left: auto;
margin-right: auto;
}

.respon2 {
position: relative;
width: 100%;
padding-left: 15px;
padding-right: 15px;
}

.respon2: : after {
top: 100%;
right: 0;
width: 100%;
height: 10000px;
transform-origin: top right;
-webkit-transform: skew(180deg, 8deg);
-moz-transform: skew(180deg, 8deg);
-ms-transform: skew(180deg, 8deg);
-o-transform: skew(180deg, 8deg);
transform: skew(180deg, 8deg);
}

}

@media (max-width: 768px) {

}

@media (max-width: 576px) {

}

@media (max-width: 480px) {

}