@import url("./includes/footer.css");
@import url("./includes/font.css");
@import url("./includes/input.css");
@import url("./includes/logo.css");
@import url("./includes/menubar.css");

html, body{
scroll-behavior:smooth;
font-family:'Urbanist', sans-serif;
}

body{
margin:0;
background-image:linear-gradient(180deg, #ffffff, #f59991);
background-attachment:fixed;
}

.text h1, .text h2, .text p{
margin:40px;
line-height:25px;
}

.text h1, .text h2{
display:inline-block;
margin-left:20px;
margin-right:20px;
font-size:50px;
font-weight:300;
line-height:normal;
}

.text h2{
font-size:25px;
margin-top:-25px;
}

.text h3{
font-size:25px;
margin-top:40px;
}

#description{
position:relative;
/* background-image:linear-gradient(to bottom, transparent, #ffffff), url('https://stratocreative.com/assets/media/images/misc/misc/misc/background.png'); */
background-size:cover;
background-position:top;
background-repeat:no-repeat;
display:inline-block;
margin-bottom:25px;
opacity:0;
width:100%;
z-index:0;
}

#description h1{
font-size:50px;
margin-bottom:-80px;
}

#description h2{
color:#ff0000;
font-size:80px;
margin-bottom:-80px;
}

#description a{
text-decoration:none;
}

#description p{
font-size:25px;
margin-top:70px;
margin-bottom:0;
line-height:35px;
}

h1{
font-family:'Urbanist', sans-serif;
}

.headline, .headline-emphasis{
word-break:break-word;
}

.headline{
font-family:'Urbanist', sans-serif;
}

#sales_buttons{
display:block;
float:left;
clear:both;
margin-top:10px;
margin-left:50px;
}

#sales_buttons a{
color:#ffffff;
}

#hero_image{
background-size:contain;
background-position:center;
background-repeat:no-repeat;
border:none;
margin-left:75px;
margin-right:75px;
}

#services{
display:inline-block;
width:100%;
}

#section-1, #section-2{
/*
background-color:#ffffff30;
border:1px solid #ff000010;
border-top-left-radius:55px;
border-top-right-radius:125px;
border-bottom-left-radius:90px;
border-bottom-right-radius:90px;
border-radius:50px;
*/
margin-top:50px;
margin-bottom:0;
margin-left:50px;
margin-right:50px;
padding:50px;
display:inline-block;
/*
box-shadow:0 1px 25px 5px #f2f2f2;
*/
vertical-align:top;
}

#services #section-1{
background-color:#ffffff;
}

#services #section-2{
background-color:#ffffff;
}

#section-1-content, #section-2-content{
display:inline-block;
max-width:60%;
}

/*
#section-1-content{
float:right;
clear:right;
}

#section-2-content{
float:left;
clear:left;
}
*/

#services .headline, #services .description, #services{
font-family:'Urbanist', sans-serif;
text-align:left;
}

#services .headline, #services .description{
color:#000000;
}

#services{
display:block;
}

#services .section-image{
/* background-color:#ffffff30; */
background-position:center;
background-repeat:no-repeat;
width:250px;
height:250px;
padding:20px;
/*
border:1px solid #ff000020;
border-radius:55px;
box-shadow:0 12px 0 0 #ff000020;
margin-right:50px;
*/
}

#services #section-1 .section-image{
background-image:url('https://stratocreative.com/assets/media/images/design.png');
background-size:75%;
float:left;
clear:left;
}

#services #section-2 .section-image{
background-image:url('https://stratocreative.com/assets/media/images/maintenance.png');
background-size:75%;
float:right;
clear:right;
}

#services .headline{
font-size:50px;
font-weight:300;
margin-bottom:0;
}

#services .description{
word-break:break-word;
line-height:30px;
margin-bottom:0;
font-size:25px;
font-weight:300;
}

.cta_tagline{
color:#000000;
font-size:20px;
text-align:left;
}

#services{
display:inline-block;
}

@media only screen and (min-width: 974px){
#main{
margin-bottom:50px;
}

#services .section-image{
margin-top:100px;
}

#hero_image{
position:absolute;
top:40px;
right:50px;
/* background-color:#ff0000; */
float:right;
clear:both;
/* box-shadow:0 0 0 75px #ff000040; */
}

#description p{
width:50%;
}

#cta-1, #cta-2{
float:left;
clear:both;
}

#cta-1 .cta_button, #cta-2 .cta_button{
float:left;
clear:both;
}

/*
#cta_blob{
margin-top:50px;
margin-bottom:-115px;
margin-right:320px;
float:right;
clear:both;
}
*/
}

@media only screen and (max-width: 975px){
#main{
margin-bottom:10px !important;
}

#hero_image{
top:0;
/* background-color:#ff000020; */
width:300px;
height:300px;
float:none;
/* box-shadow:0 0 0 75px #ff000010; */
position:relative;
z-index:1;
}

#description h1, #description h2, #description p{
float:none !important;
clear:none !important;
margin-left:25px;
margin-right:25px;
text-align:center !important;
width:75% !important;
}

#description p{
width:80%;
}

#sales_buttons{
display:inline-block;
float:none;
clear:none;
margin-left:0;
}

#cta-1, #cta-2{
margin-top:60px;
}

#section-1, #section-2{
width:calc(100% - 80px);
margin-top:20px;
margin-bottom:0;
margin-left:20px;
margin-right:20px;
padding:20px;
}

#section-1-content, #section-2-content{
float:none;
clear:none;
max-width:100%;
}

#services #section-1 .section-image, #services #section-2 .section-image{
float:none;
clear:none;
}

#section-1-content .headline, #section-1-content .description, #section-1-content .cta_tagline, #section-2-content .headline, #section-2-content .description, #section-2-content .cta_tagline{
float:none;
clear:none;
text-align:center;
}

/*
#services .headline{
font-size:35px;
}
*/
}