/*HOME PAGE*/

/*--------------------------------*/

/*Top Section*/

#topsection {margin: auto; background-image: url("images/toppic1.jpg"); background-position: 50% 50%; background-size: cover; background-color: #072D56;}
#topsection .bodyarea {padding-bottom: 60px; color: #FFF;}
#topsection img {display: block; width: 600px; height: 300px; width: 100%; height: auto; max-width: 600px; margin: auto; text-align: center;}
#topsection .tophead {font-family: 'Archivo', Arial, Helvetica, sans-serif; font-weight: 700; font-size: 3em; line-height: 1.15; margin-bottom: 50px;}
#topsection .btn {margin-top: 50px;}

@media (min-width: 1331px) {#topsection section:last-child .btn {display: none;}}
@media (max-width: 1330px) {
#topsection section:first-child .btn {display: none;} #topsection section:last-child .btn {display: table; margin: 30px auto 0 auto;}
}

@media (min-width: 1021px) {
#topsection {padding-top: 50px;}
#topsection .bodyarea {-webkit-display: flex; display: flex; -webkit-flex-direction: row; flex-direction: row;}
#topsection .bodyarea section:first-child {margin-right: 30px; width: 49%;}
#topsection .bodyarea section:last-child {margin-left: 30px; width: 51%;}
}
@media (max-width: 1020px) {
#topsection {-webkit-display: flex; display: flex; -webkit-flex-direction: column; flex-direction: column; padding-top: 30px;}
#topsection section:first-child {-webkit-order: 2; order: 2; text-align: center;}
#topsection section:last-child {-webkit-order: 1; order: 1; margin-top: 30px;}
}
@media (max-width: 500px) {#topsection .tophead {font-size: calc(12.5vw - 3px);}}

/*--------------------------------*/

/*Switch To section*/

#switchto {padding: 50px 0 10px 0; margin: auto;}
#switchto img {display: block; width: 500px; height: 300px; width: 100%; height: auto; max-width: 700px;}
#switchto section {align-self: center;} #switchto section span {font-weight: 600;}
#switchto .stbox {margin: 30px auto 0 auto; font-size: 1.7em; font-weight: 600; line-height: 1.4; color: #FC7D01; /*text-align: center; padding: 30px; border-radius: 30px; background-color: #B0DDF3; border: 4px solid #181897; width: 70%; color: #181897;*/}
#switchto .stbox p {margin-bottom: 0;}

#switchto .bodyarea section:last-child img {display: inline-block; width: 38px; height: 38px; margin-right: 10px; border-radius: 5px;}

/*@media (min-width: 1351px) {#switchto section:first-child .btn {display: none !important;}}
@media (max-width: 1350px) {#switchto section:last-child .btn {display: none !important;}}*/

@media (min-width: 1351px) {
#switchto .bodyarea {-webkit-display: flex; display: flex; -webkit-flex-direction: row; flex-direction: row; /*flex-wrap: wrap-reverse;*/}
#switchto .bodyarea section:first-child {margin-right: 20px; width: 50%;}
#switchto .bodyarea section:last-child {margin-left: 20px; width: 50%;}
}
@media (max-width: 1350px) {
#switchto {-webkit-display: flex; display: flex; -webkit-flex-direction: column; flex-direction: column;}
#switchto section:first-child {-webkit-order: 2; order: 2;} #switchto section:last-child {-webkit-order: 1; order: 1; margin-top: 30px;}
#switchto img {margin: auto;}
}

/*--------------------------------*/

/*Why Us*/

/*#whyus section:first-child {border: 1px solid red;}
#whyus section:first-child div:nth-of-type(1) {border: 1px solid yellow;}
#whyus section:first-child div:nth-of-type(2) {border: 1px solid yellow;}
#whyus section:first-child div:nth-of-type(3) {border: 1px solid green;}
#whyus section:first-child div:nth-of-type(4) {border: 1px solid black;}
#whyus section:last-child {border: 1px solid blue;}
#whyus .pictext {border: 3px solid purple;}*/

#whyus {margin: auto; background-image: url("images/whyusback.jpg"); background-position: 50% 25%; background-size: cover; background-color: #02154B;}
#whyus .bodyarea {-webkit-display: flex; display: flex; padding: 70px 0; justify-content: center; align-items: center; color: #FFF;}
#whyus section:first-child {display: grid;}
#whyus span {display: block;}
#whyus img {display: block; width: 600px; height: 350px; width: 100%; height: auto; max-width: 600px; margin: 15px auto; border-radius: 30px; border: 4px solid #000;}
#whyus .btn a {background-color: #FCD302;} #whyus .btn a:hover {background-color: #FCF400;}

@media (min-width: 1416px) {
#whyus .bodyarea {-webkit-flex-direction: row; flex-direction: row;}
#whyus section:first-child {margin-right: 30px; width: 57%; grid-template-columns: 50% 50% 50%;}

#whyus .p1 {grid-row: 1 / 1; grid-column: 1 / 3;}
#whyus .p2 {grid-row: 2 / 2; grid-column: 1 / 2; padding-right: 15px;}
#whyus .p3 {grid-row: 2 / 2; grid-column: 2 / 3; padding-left: 15px;}
#whyus .p4 {grid-row: 3 / 3; grid-column: 1 / 3; padding-top: 10px;}

#whyus section:last-child {margin-left: 20px; width: 48%; max-width: 600px;}
#whyus section:last-child .btn {display: none;}
}
@media (max-width: 1415px) {
#whyus .bodyarea {-webkit-flex-direction: column; flex-direction: column;}
#whyus section:first-child {-webkit-order: 1; order: 1; grid-template-columns: 34.5% 34.5% 34.5% 34.5%;}
#whyus section:last-child {-webkit-order: 2; order: 2; margin-top: 20px;}

#whyus .p1 {grid-row: 1 / 1; grid-column: 1 / 4;}
#whyus .p2 {grid-row: 2 / 2; grid-column: 1 / 2;}
#whyus .p3 {grid-row: 2 / 2; grid-column: 2 / 3;}
#whyus .p4 {grid-row: 2 / 2; grid-column: 3 / 3;}

#whyus section:first-child .btn {display: none;} #whyus section:last-child .btn {display: table; margin: auto;}
}

@media (max-width: 1415px) and (min-width: 1131px) {#whyus .p2, #whyus .p3, #whyus .p4 {width: 90%;}}
@media (max-width: 1130px) {
#whyus section:first-child {grid-template-columns: 50% 50% 50%;}
#whyus .p1 {grid-row: 1 / 1; grid-column: 1 / 3;}
#whyus .p2 {grid-row: 2 / 2; grid-column: 1 / 2;}
#whyus .p3 {grid-row: 2 / 2; grid-column: 2 / 3;}
#whyus .p4 {grid-row: 3 / 3; grid-column: 1 / 3;}
}
@media (max-width: 1130px) and (min-width: 661px) {#whyus .p2 {padding-right: 20px;}, #whyus .p3 {padding-left: 20px;}}
@media (max-width: 660px) {#whyus section:first-child {display: block;}}


/*--------------------------------*/

/*Total Voice Difference*/

#tvd {margin: auto;} #tvd .bodyarea {padding: 50px 0;}
#tvd .bodyarea section:first-child img {display: block; width: 600px; height: 300px; width: 100%; height: auto; max-width: 800px;}
#tvd .bodyarea section:last-child img {display: inline-block; width: 38px; height: 38px; margin-right: 10px; border-radius: 5px;}

#tvd td {vertical-align: top;} #tvd td:first-child {padding-right: 20px;} #tvd td:last-child {padding-left: 20px;}

/*@media (min-width: 1401px) {#tvd .bodyarea section:first-child .btn {display: none !important;}}
@media (max-width: 1400px) and (min-width: 1266px) {
#tvd .bodyarea section:last-child .btn {display: none !important;}
#tvd .bodyarea section:first-child .btn {display: table; margin: 20px auto 0 auto;}
}*/

@media (min-width: 1666px) {
#tvd .bodyarea {-webkit-display: flex; display: flex; -webkit-flex-direction: row; flex-direction: row; /*flex-wrap: wrap-reverse;*/}
#tvd .bodyarea section:first-child {margin-right: 40px; width: 45%;}
#tvd .bodyarea section:last-child {margin-left: 40px; width: 55%;}
/*#tvd .bodyarea section:last-child .btn {display: table; margin: 20px auto 0 auto;}*/
}
@media (max-width: 1665px) {
#tvd {-webkit-display: flex; display: flex; -webkit-flex-direction: column; flex-direction: column;}
#tvd section:first-child {-webkit-order: 2; order: 2;} #tvd section:last-child {-webkit-order: 1; order: 1; margin-top: 30px;}
#tvd .bodyarea section:first-child img {margin: auto;}
/*#tvd .bodyarea section:first-child .btn {display: none;}
#tvd .bodyarea section:last-child .btn {display: table; margin: 20px auto 0 auto;}*/
}

@media (min-width: 651px) {#tvd td {width: 50%;}}
@media (max-width: 650px) {
#tvd td {display: block; padding: 0 !important;}
/*#tvd .bodyarea section:last-child .btn {text-align: left; margin-left: 0;}*/
}

/*--------------------------------*/

/*Benefits*/

/*#benefits section:first-child {border: 1px solid red;}
#benefits section:first-child div:nth-of-type(1) {border: 1px solid yellow;}
#benefits section:first-child div:nth-of-type(2) {border: 1px solid yellow;}
#benefits section:first-child div:nth-of-type(3) {border: 1px solid green;}
#benefits section:first-child div:nth-of-type(4) {border: 1px solid black;}
#benefits section:last-child {border: 1px solid blue;}
#benefits .pictext {border: 3px solid purple;}*/

#benefits {margin: auto; background-image: url("images/toppic1.jpg"); background-position: 50% 50%; background-size: cover; background-color: #072D56;}
#benefits .bodyarea {-webkit-display: flex; display: flex; padding: 50px 0; justify-content: center; align-items: center; color: #FFF;}
#benefits section:first-child {display: grid;} #benefits section:last-child {text-align: center;}
#benefits span:not(.btn span) {display: block;}
#benefits img {display: block; width: 600px; height: 350px; width: 100%; height: auto; max-width: 600px; margin: 15px auto;}
#benefits .btn {display: table; margin: 30px auto 0 auto; text-align: center;}
#benefits .btn a {font-size: 1.3em;}
#benefits .p5 {margin-top: 45px;}

@media (min-width: 1416px) {
#benefits .bodyarea {-webkit-flex-direction: row; flex-direction: row;}
#benefits section:first-child {margin-right: 30px; width: 57%; grid-template-columns: 50% 50% 50%;}

#benefits .p1 {grid-row: 1 / 1; grid-column: 1 / 3;}
#benefits .p2 {grid-row: 2 / 2; grid-column: 1 / 2; padding-right: 15px;}
#benefits .p3 {grid-row: 2 / 2; grid-column: 2 / 3; padding-left: 15px;}
#benefits .p4 {grid-row: 3 / 3; grid-column: 1 / 3; padding-top: 10px;}
#benefits .p5 {grid-row: 4 / 4; grid-column: 1 / 3; padding-top: 10px;}

#benefits section:last-child {margin-left: 30px; width: 48%; max-width: 600px;}
}
@media (max-width: 1415px) {
#benefits .bodyarea {-webkit-flex-direction: column; flex-direction: column;}
#benefits section:first-child {-webkit-order: 1; order: 1; grid-template-columns: 34.5% 34.5% 34.5% 34.5%;}
#benefits section:last-child {-webkit-order: 2; order: 2; margin-top: 20px;}

#benefits .p1 {grid-row: 1 / 1; grid-column: 1 / 4;}
#benefits .p2 {grid-row: 2 / 2; grid-column: 1 / 2;}
#benefits .p3 {grid-row: 2 / 2; grid-column: 2 / 3;}
#benefits .p4 {grid-row: 2 / 2; grid-column: 3 / 3;}
#benefits .p5 {grid-row: 3 / 3; grid-column: 1 / 4;}
}

@media (max-width: 1415px) and (min-width: 1131px) {#benefits .p2, #benefits .p3, #benefits .p4 {width: 90%;}}
@media (max-width: 1130px) {
#benefits section:first-child {grid-template-columns: 50% 50% 50%;}
#benefits .p1 {grid-row: 1 / 1; grid-column: 1 / 3;}
#benefits .p2 {grid-row: 2 / 2; grid-column: 1 / 2;}
#benefits .p3 {grid-row: 2 / 2; grid-column: 2 / 3;}
#benefits .p4 {grid-row: 3 / 3; grid-column: 1 / 3;}
#benefits .p5 {grid-row: 4 / 4; grid-column: 1 / 3;}
}
@media (max-width: 1130px) and (min-width: 761px) {#benefits .p2 {padding-right: 40px;}, #benefits .p3 {padding-left: 40px;}}
@media (max-width: 760px) {#benefits section:first-child {display: block;} #benefits .btn span {display: block;}}


/*--------------------------------*/

/*Analysis*/

#analysis {margin: auto; background-color: #F0F2F4;}
#analysis .bodyarea {-webkit-display: flex; display: flex; padding: 50px 0; justify-content: center; align-items: center;}
#analysis img {display: block; width: 600px; height: 350px; width: 100%; height: auto; max-width: 800px; margin: 0 auto 30px auto; border-radius: 30px;}
#analysis section:first-child img {margin-top: 40px;}
#analysis .bodyarea section:last-child img {display: inline-block; width: 38px; height: 38px; margin-right: 10px; border-radius: 5px;}
#analysis .btn {display: table; margin: auto;}
#analysis td {vertical-align: top;}

@media (min-width: 1241px) {
#analysis .bodyarea {-webkit-flex-direction: row; flex-direction: row;}
#analysis section:first-child {margin-right: 30px; width: 52%;}
#analysis section:last-child {margin-left: 30px; width: 57%;}
#analysis table tr:nth-child(2) td {padding-top: 25px;}
}
@media (max-width: 1240px) {
#analysis .bodyarea {-webkit-flex-direction: column; flex-direction: column;}
#analysis section:first-child {-webkit-order: 1; order: 1; grid-template-columns: 34.5% 34.5% 34.5% 34.5%;}
#analysis section:last-child {-webkit-order: 2; order: 2; margin-top: 30px;}
}