html - nth Child in CSS -

i have used nth child before reason can not target correct div:

<div class='main'>...</div>   <div class='color'>...</div>   <div class='number'>...</div>     <div class='target_div'>...</div>       <div class='target_me_one'>...</div>       <div class='target_me_two'>...</div> <div class='main'>...</div> <div class='main'>...</div> <div class='main'>...</div> <div class='main'>...</div> <div class='main'>...</div> <div class='main'>...</div> 

i hoping first occurrence of main, second child of main (number), first child of number (target_div) , both of children of target_div.

the whole objective of alter target_me_one / target_me_two first occurrence of main. can not target these 2 individually through selectors (due plug in i'm using).

is possible or way off???

this expecting, without relying on classes specific selectors. check out jsfiddle

      .main:first-of-type > *:nth-child(2) > *:nth-child(1) * {         color: red;       }