/* typefaces section 
  .section-copy-content {padding-top: 35px;} */
  /* gotham do */
  .gotham-section {display: flex; flex-direction: column; width: 100%;}
  .gotham-right {width: 100%; font-size: 25px; line-height: 35px; justify-content: left; margin-top: 3px;}
  .gotham-right .bold {font-weight: 700;}
  .gotham-right .medium {font-weight: 500;}
  .gotham-right .regular {font-weight: 400;}
  .gotham-right .light {font-weight: 300;}
  .gotham-left {width:100%; justify-content: left; margin-top: 25px;}
  .gotham-intro p {font-size: 14px; margin-bottom: 14px;}
  .gotham-alphabet p {font-weight: 400; font-size: 19px; line-height: 29px; letter-spacing: 1px;} 
  /* gotham dont */
  .gotham-dont {display: flex; flex-direction: column; align-items: flex-start; width: 100%;}
  .gotham-dont .left {font-size: 24px; ; line-height: 35px; width: 100%; margin: 0;}
  .gotham-dont .right {font-size: 24px; ; line-height: 35px; width: 100%; margin: 0;}
  .gotham-dont .left .bold {font-weight: 600;}
  .gotham-dont .left .medium {font-weight: 500;}
  .gotham-dont .right .regular {font-weight: 400;}
  .gotham-dont .right .light {font-weight: 300;}
  
    /* montserrat do */
  .mont-section {display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; width: 100%;}
  .mont-right {width: 100%; font-size: 24px; line-height: 35px; justify-content: left;}
  .mont-right .extra {font-weight: 800;}
  .mont-right .bold {font-weight: 700;}
  .mont-right .medium {font-weight: 500;}
  .mont-right .regular {font-weight: 400;}
  .mont-right .light {font-weight: 300;}
  .mont-left {width:100%; justify-content: left; margin-top: 25px;}
  .mont-intro p {font-size: 14px; margin-bottom: 14px;}
  .mont-alphabet p {font-size: 19px; line-height: 29px; letter-spacing: 1px;} 
  /* montserrat dont */
  .mont-dont {display: flex; flex-direction: column; align-items: flex-start; width: 100%;}
  .mont-dont .left {font-size: 24px; ; line-height: 35px; width: 100%; margin: 0;}
  .mont-dont .right {font-size: 24px; ; line-height: 35px; width: 100%; margin: 0;}
  .mont-dont .left .extra {font-weight: 800;}
  .mont-dont .left .bold {font-weight: 700;}
  .mont-dont .left .medium {font-weight: 500;}
  .mont-dont .right .regular {font-weight: 400;}
  .mont-dont .right .light {font-weight: 300;}

  /* arial do */
  .arial-do { }
  .arial-do .left {font-size: 24px; ; line-height: 35px; width: 100%;}
  .arial-do .left .bold {font-family: arial; font-weight: bold;}
  .arial-do .left .regular {font-family: arial;}
  /* arial dont */
  .arial-dont { }
  .arial-dont .left {font-size: 24px; ; line-height: 35px; width: 100%;}
  .arial-dont .left .bold {font-family: arial; font-weight: bold;}
  .arial-dont .left .regular {font-family: arial;}

@media only screen and (min-width: 600px) {
.gotham-section {display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; width: 100%; margin: 0;}
.gotham-right {width: 42%;}
.gotham-left {width: 54%; margin: 0px;}
.gotham-dont {display: flex; flex-direction: row; align-items: flex-start; width: 100%;}
.gotham-dont .left {width: 48%;}
.gotham-dont .right {width: 48%;}

.mont-section {display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; width: 100%;}
.mont-right {width:42%;}
.mont-left {width:54%; margin: 0px;}
.mont-dont {display: flex; flex-direction: row; align-items: flex-start; width: 100%;}
.mont-dont .left {width: 48%;}
.mont-dont .right {width: 48%;}
}
 

/* color page */ 
.color-section-link {color:#41B6E6; font-weight: 600;}
.color-section-link a:visited {color:#41B6E6; font-weight: 600;}
/* white section */ 
.white {max-width: 100%; border: 1px solid #D3D3D3; padding: 30px 50px 40px 30px; margin-bottom: 30px;}
.white .text-on {color: #292929; font-size: 16px; margin: 0;}
.white .rule {background-color: #41B6E6; height: 3px; border-radius: 1.5px; width: 270px; margin: 5px 0 20px 0; padding}
.white .headline {color: #004B87; font-size: 35pt; line-height: 38pt; font-weight: 600;}
.white .subhead {color: #41B6E6; font-size: 15pt; line-height: 23pt; font-weight: 600; padding: 15px 0; margin: 0;}
.white .paragraph {color: #292929; font-size: 10pt; line-height: 15pt; padding: 2px 0; margin: 0; max-width: 500px;}
.white .paragraph .lite-blue {color: #41B6E6; font-weight: 600;}

/* light blue section */
.lite {max-width: 100%; background-color: #41B6E6; padding: 30px 50px 40px 30px; margin-bottom: 30px;}
.lite .text-on {color: #ffffff; font-size: 16px; margin: 0;}
.lite .rule {background-color: #004B87; height: 3px; border-radius: 1.5px; width: 270px; margin: 5px 0 20px 0; padding}
.lite .headline {color: #ffffff; font-size: 35pt; line-height: 38pt; font-weight: 600;}
.lite .subhead {color: #004B87; font-size: 15pt; line-height: 23pt; font-weight: 600; padding: 15px 0; margin: 0;}
.lite .paragraph {color: #ffffff; font-size: 10pt; line-height: 15pt; padding: 2px 0; margin: 0; max-width: 500px;}
.lite .paragraph .dark-blue {color: #004B87; font-weight: 600;}
/*dark blue section */
.dark {max-width: 100%; background-color: #004B87; padding: 30px 50px 40px 30px; margin-bottom: 30px;}
.dark .text-on {color: #ffffff; font-size: 16px; margin: 0;}
.dark .rule {background-color: #41B6E6; height: 3px; border-radius: 1.5px; width: 270px; margin: 5px 0 20px 0; padding}
.dark .headline {color: #ffffff; font-size: 35pt; line-height: 38pt; font-weight: 600;}
.dark .subhead {color: #41B6E6; font-size: 15pt; line-height: 23pt; font-weight: 600; padding: 15px 0; margin: 0;}
.dark .paragraph {color: #ffffff; font-size: 10pt; line-height: 15pt; padding: 2px 0; margin: 0; max-width: 500px;}
.dark .paragraph .lite-blue {color: #41B6E6; font-weight: 600;}
/* black section */
.black {max-width: 100%; background-color: black; padding: 30px 50px 40px 30px; margin-bottom: 30px;}
.black .text-on {color: #ffffff; font-size: 16px; margin: 0;}
.black .rule {background-color: #41B6E6; height: 3px; border-radius: 1.5px; width: 270px; margin: 5px 0 20px 0; padding}
.black .headline {color: #ffffff; font-size: 35pt; line-height: 38pt; font-weight: 600;}
.black .subhead {color: #41B6E6; font-size: 15pt; line-height: 23pt; font-weight: 600; padding: 15px 0; margin: 0;}
.black .paragraph {color: #ffffff; font-size: 10pt; line-height: 15pt; padding: 2px 0; margin: 0; max-width: 500px;}
.black .paragraph .lite-blue {color: #41B6E6; font-weight: 600;}
/* color dont section */
.color-dont {display: flex; flex-direction: column; margin-top: 10px;}
.color-dont-img {width: 100%; margin-bottom: 10px;}
.color-dont-img img {width: 100%;}
@media only screen and (min-width: 600px) {
.color-dont {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.color-dont-img {width: 49%; margin-bottom: 2%;}
}


/* advanced page */
  
/* sizes section */
.size-table-desk {display: none; max-width: 100%}
.size-table-desk img {width: 90%;}
.size-table-mobile {display: block;}  
.size-table-mobile img {width: 90%;}
.size-info {padding: 30px 40px 30px 30px; max-width: 660px; border: 1px solid #D3D3D3; margin: 40px 0 0 0;}
.size-info .size-head {color: #004B87; font-weight: 600; font-size: 35pt; line-height: 39pt; letter-spacing: -0.2px; margin: 0; padding: 0;}
.size-info .size-sub {color: #41B6E6; font-weight: 600; font-size: 15pt; line-height: 23pt; letter-spacing: -0.1px; margin: 15px 0; padding: 0;}
.size-info .size-par {margin: 5px 0; color: #292929; font-size: 10pt; line-height: 15pt; margin: 0; padding: 0;}  


/* leading section */
.leading {padding: 30px 40px 30px 30px; max-width: 660px; border: 1px solid #D3D3D3; margin: 0;}
.leading .head-intro {color: #292929; font-size: 14px; line-height: 22px;}
.leading .head-ex {margin: 5px 0; color: #004B87; font-weight: 600; font-size: 35pt; line-height: 39pt; letter-spacing: -0.2px;}
.leading .lead-sub {margin-top: 30px;}
.leading .sub-intro {color: #292929; font-size: 14px; line-height: 22px;}
.leading .sub-ex {margin: 5px 0; color: #41B6E6; font-weight: 600; font-size: 15pt; line-height: 23pt; letter-spacing: -0.1px; padding: 0;}
.leading .lead-par {margin-top: 30px;}
.leading .par-intro {color: #292929; font-size: 14px; line-height: 22px;}
.leading .par-ex {margin: 5px 0; color: #292929; font-size: 10pt; line-height: 15pt;}
.lead-dont {display: flex; flex-direction: column; margin-top: 10px;}
.lead-dont-img {width: 100%; margin-bottom: 10px;}
.lead-dont-img img {width: 100%;}

/* tracking section */
.tracking {padding: 30px 40px 30px 30px; max-width: 660px; border: 1px solid #D3D3D3; margin: 0;}
.tracking .head-intro {color: #292929; font-size: 14px; line-height: 22px; padding-right: 25px;}
.tracking .head-ex {margin: 5px 0; color: #004B87; font-weight: 600; font-size: 35pt; line-height: 39pt; letter-spacing: -0.2px;}
.tracking .track-sub {margin-top: 30px;}
.tracking .sub-intro {color: #292929; font-size: 14px; line-height: 22px;}
.tracking .sub-ex {margin: 15px 0; color: #41B6E6; font-weight: 600; font-size: 15pt; line-height: 23pt; letter-spacing: -0.1px; padding: 0;}
.tracking .track-par {margin-top: 30px;}.kern-do
.tracking .par-intro {color: #292929; font-size: 14px; line-height: 22px;}
.tracking .par-ex {margin: 5px 0; color: #292929; font-size: 10pt; line-height: 15pt;}
.track-dont {display: flex; flex-direction: column; margin-top: 10px;}
.track-dont-img {width: 100%; margin-bottom: 10px;}
.track-dont-img img {width: 100%;}

/* kerning section */
.kern-do img {width: 300px;}
.kern-dont {padding: 30px; border: 1px solid #D3D3D3; text-align: center;}
.kern-dont img {width: 70%;}

@media only screen and (min-width: 600px) {  
.size-table-desk {display: block;}
.size-table-mobile {display: none;}
  
.lead-dont {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.lead-dont-img {width: 49%; margin-bottom: 2%;}
.track-dont {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.track-dont-img {width: 49%; margin-bottom: 2%;}

@media only screen and (min-width: 768px) {
  
.leading .lead-head {display: flex; flex-direction: row; align-items: center; margin: 0; padding: 0;}
.leading .head-intro {min-width: 130px; max-width: 130px; padding-right: 25px;}
.leading .lead-sub {display: flex; flex-direction: row; align-items: center; margin: 0; padding: 0;}
.leading .sub-intro {min-width: 130px; max-width: 130px; padding-right: 25px;}
.leading .sub-ex {max-width: 250px;}
.leading .lead-par {display: flex; flex-direction: row; align-items: center; margin: 0; padding: 0;}
.leading .par-intro {min-width: 130px; max-width: 130px; padding-right: 25px;}
  
.tracking .track-head {display: flex; flex-direction: row; align-items: center; margin: 0; padding: 0;}
.tracking .head-intro {min-width: 130px; max-width: 130px; padding-right: 25px;}
.tracking .track-sub {display: flex; flex-direction: row; align-items: center; margin: 0; padding: 0;}
.tracking .sub-intro {min-width: 130px; max-width: 130px; padding-right: 25px;}
.tracking .sub-ex {max-width: 250px;}
.tracking .track-par {display: flex; flex-direction: row; align-items: center; margin: 0; padding: 0;}
.tracking .par-intro {min-width: 130px; max-width: 130px; padding-right: 25px;}

  
}