/* desktop */

.logo {height: 50px; 
    width: 272px;
    background-image: url("pictures/arrowslogo.png");
    position: absolute;
    left: 58px;
    top: 15.5px;}

.logo a {display: none;}

header {box-sizing: border-box;
     display: flex;
     flex-direction: row;
     justify-content: flex-end;
     align-items: center;
     padding: 28px 32px 28px 250px;
     gap: 48px;
     position: absolute;
     width: 100%;
     height: 80px;
     left: 0px;
     top: 0px;
     background: #FFFFFF;
     border-bottom: 1px solid #21D0B3;}

nav a {width: 56px;
 height: 24px;
 font-family: 'Inter', sans-serif;
 font-style: normal;
 font-weight: 400;
 font-size: 20px;
 line-height: 24px;
 color: #181818;
 text-decoration: none;
 padding-left: 40px;}

 .big-photo {
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 556px;
    left: 0px;
    top: 80px;
    background-image: url("pictures/cultue-big.png")}

    .textbox {  background-color: white;
        position: absolute;
        
        width: 927px;
        height: 1200px;
        left: 167px;
        top: 534px;
        justify-content: center;}
                
.row1 {display: flex;
      align-items: top;
    justify-content: center;
    margin-left: 0px;
    margin-bottom: 0px;
    justify-content: space-between;}

.row2 {margin-left: 320px;}

.row3 {margin-left: 200px; display: flex;}

.row4 {margin-left: 320px; display:flex;}

.row5 {margin-left: 200px; display: flex;}
          
    


.textbox p {font-family: 'Inter';
font-style: normal;
font-weight: 300;
font-size: 20px;
line-height: 164%;   
color: #000000;
margin-left: 30px;
margin-top: 50px;}

h2 {font-family: 'Inter';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 130%;
color: #1D9F8A;
margin-left: 30px;}

h1 {font-family: 'Inter';
font-style: normal;
font-weight: 700;
font-size: 48px;
line-height: 58px;
color: #260E0E;
margin-left: 30px;
margin-top: 20px;}

footer {position: absolute;
        width: 100%;
        height: 120px;
        top: 7000px;
        background-color: #D7FFF8;
        display: flex;
        justify-content: space-around;}

.footertext1 p, .footertext2 p {font-family: 'Inter';
      font-style: normal;
      font-weight: 400;
      font-size: 14px;
      line-height: 10px;
      color: #3D3D3D;}

.footertext1 span {font-size: 24px;
font-style: normal;
font-weight: 100;}

.footertext2 span {  font-weight: 700;
font-family: 'Inter';
font-style: normal;}

.mobile {display: none;}

.text span {font-weight: 700;}






/* mobile phone */

@media (max-width: 390px) {

    .mobile {display: contents;}

main {
    width: 390px;
    }

.logo { height: 37px; 
    width: 170px;
    background-image: url("pictures-mobile/logo-mobile3.png");
    background-repeat: no-repeat;
    position: absolute;
    left: 15px;
    top: 13px;}



header { position: absolute;
      width: 390px;
      height: 55px;
      left: 0px;
      top: 0px;
      box-sizing: border-box;
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      align-items: center;
      padding: 18px 22px 18px 22px;
      background-color: #FFFFFF;
      border-bottom: 1px solid #21D0B3;}

      /* mobile hamburger menu  */

#myMobileLinks {display:none;}

.icon {position: absolute;
      width: 31px;
      height: 52px;
      left: 319px;
      top: 3px;}

.icon img {margin-left: -20px;}

.topnav { 
       position: absolute;
       background-color: #c65353;
      top: 0px;
      right: 10px;}
    
.topnav a {color: rgb(255, 255, 255);
      padding: 14px 16px;
      text-decoration: none;
      text-align: center;
      font-size: 20px;
      display: block;}
  
     

/* nav a {position: absolute;
    width: 31px;
    height: 52px;
    left: 325px;
    top: 3px;} */

 .big-photo {
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    width: 390px;
    height: 556px;
    left: 0px;
    top: 55px;
    background-image: url("pictures-mobile/bigculture-mob.png");}

   


.two-illustrations, .row2, .row4 {
    display: flex;
    justify-content: center;
    margin-left: 25px;
    margin-right: 25px;
    margin-bottom: -30px;}
           
        
                
 .textbox { background-color: white;
            position: absolute;
            width: 390px;
            min-height: 1363px;
            left: 0px;
            top: 534px;
            }
        

        .textbox p {font-family: 'Inter';
            font-style: normal;
            font-weight: 300;
            font-size: 16px;
            line-height: 164%;   
            color: #000000;
            margin-left: auto;
            margin-right: auto;
            margin-top: 50px;
            text-align: left;
            width: 340px;}

h2 {font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 21px;
    color: #1D9F8A;
    margin-left: 30px;}

h1 {font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 29px;
    color: #260E0E;
    margin-left: 30px;
    margin-top: 20px;}

    .textbox img {display:block;
        margin-left: auto;
        margin-right:auto;
        margin-top: 30px;}

        .title {height: 100px;
            margin-top: 630px;}

    figcaption {font-family: 'Inter';
                font-style: normal;
                 font-weight: 300;
                font-size: 12px;
                line-height: 164%;   
                color: #000000;
                text-align: center;}

    figure {margin-bottom: 0px;}

  


    footer { position: absolute;
        width: 390px;
        height: 120px;
        top: 9175px;
        background-color: #D7FFF8;
        display: flex;
        justify-content: space-around;
        left: 0px;}

.backtotop {position: absolute;
       background-color: #21D0B3;
       width: 390px;
       height: 50px;
       left: 0px;
       top: -50px;
       color: white;
       font-family: 'Inter';
       font-style: normal;
       font-weight: 400;
       font-size: 16px;
       line-height: 19px;
       text-align: center;
       display: flex;}

.backtotop p {padding-bottom: 30px;
             margin-left: 120px;}

.backtotop span {font-weight: 600;
               font-size: 30px;
               margin-right: 20px;}

.footertext1 p, .footertext2 p {    font-family: 'Inter';
                                font-style: normal;
                                font-weight: 400;
                                font-size: 12px;
                                line-height: 10px;
                                color: #3D3D3D;
                                width: 180px;}

.footertext1 span {font-size: 11px;
                   font-style: normal;
                   font-weight: 100;}

.footertext2 span {  font-weight: 700;
                     font-family: 'Inter';
                     font-style: normal;}

#email1 {font-size: 10px;
        margin-top: 20px;}
#email2 {font-size: 11px;
        margin-top: 20px;}
    
        .desktop {display: none;}
    
        .back {width: 120px; 
            height: 50px;
             display:flex;}
    
         #back h2 { text-decoration: underline ;
                margin-top: 20px;
                margin-left: 30px;
                width: 70px;
                color: white;
                font-family: 'Inter';
                font-style: normal;
                font-weight: 500;
                font-size: 16px;
                line-height: 26px;} 
            
    .text span {font-weight: 700;}}